Html ppt by Fathima faculty Hasanath college for women bangalore

It is the document type
The text between <html> and </html> describes the
web page
The text between <body> and </body> is the visible
page content
The text between <h1> and </h1> is displayed as a
heading
The text between and is displayed as a
paragraph

HTML is a language for describing web pages.
HTML stands for Hyper Text Markup Language
HTML is a markup language
A markup language is a set of markup tags
The tags describe document content
HTML documents contain HTML tags and plain text
HTML documents are also called web pages

HTML markup tags are usually called HTML tags
HTML tags are keywords (tag names) surrounded
by angle brackets like <html>
HTML tags normally come in pairs like and 
The first tag in a pair is the start tag, the second tag is
the end tag
The end tag is written like the start tag, with a forward
slash before the tag name
Start and end tags are also called opening
tags and closing tags
<tagname>content</tagname>

"HTML tags" and "HTML elements" are often used to
describe the same thing.
But strictly speaking, an HTML element is everything
between the start tag and the end tag, including the
tags:
HTML Element:
This is a paragraph.

Web Browsers
The purpose of a web browser (such as Google
Chrome, Internet Explorer, Firefox, Safari) is to read
HTML documents and display them as web pages.
The browser does not display the HTML tags, but
uses the tags to interpret the content of the page:

HTML Page Structure
Below is a visualization of an HTML page
structure:
<html>
<body>
<h1>This a heading</h1>
This is a paragraph.
This is another paragraph.
</body>
</html>

Writing HTML Using Notepad or TextEdit

Follow the 4 steps below to create your first web page with Notepad.

Step 1: Start Notepad
To start Notepad go to:
Start
    All Programs
        Accessories
            Notepad

Step 3: Save Your HTML
Select Save as.. in Notepad's file menu.
When you save an HTML file, you can use either the .htm or the .html file extension.
There is no difference, it is entirely up to you.
Save the file in a folder that is easy to remember, like w3schools.

Step 4: Run the HTML in Your Browser
Start your web browser and open your html file from the File, Open menu, or just
browse the folder and double-click your HTML file.
The result should look much like this:

<html>
<head>
<title>Title of the document</title>
</head>

<body>
The content of the document......
</body>

</html>

Attributes
Attribute Value
Alink Specifies the color of an active link in a document
background. Specifies a background image for a
document
bgcolor Specifies the background color of a document
link. Specifies the color of unvisited links in a document
text Specifies the color of the text in a document
 vlink Specifies the color of visited links in a document

Example
<html>
<head>Line break</head>
 This is
 a para
 graph with line breaks
</html>

line break
This is
a para
graph with line breaks

Example
<html>
This is a paragraph
This is another paragraph
</html>

Output

This is a paragraph

This is another paragraph

Attributes
align
Left
Right
center

Specifies the alignment of the text within a paragraph

<html>
<body>

A right-aligned paragraph.

Note: The align attribute is deprecated
in HTML 4, and is not supported in HTML5. Use CSS
instead.

</body>
</html>

Out put
A right-aligned paragraph.

Note: The align attribute is deprecated in HTML 4,
and is not supported in HTML5. Use CSS instead.

Example

<html>
<body>

This is some text!

The size attribute was deprecated in HTML 4, and is not
supported in HTML 4.01 Strict DTD or in XHTML 1.0 Strict
DTD. Use CSS instead.

</body>
</html>

Out put

This is some text!
The size attribute was deprecated in HTML 4, and is
Not supported in HTML 4.01 Strict DTD or in XHTML 1.0
Strict DTD. Use CSS instead.

<html>
<body background="w3s.png">

<h1>Hello world!</h1>
<a href="http://www.w3schools.com">Visit
W3Schools.com!</a>
The background attribute was deprecated in HTML 4,
and is not supported in HTML 4.01 Strict DTD or in
XHTML 1.0 Strict DTD. Use CSS instead.

</body>
</html>

<html>
<body bgcolor="#ff0000">

<h1>Hello world!</h1>
<a href="http://www.w3schools.com">Visit W3Schools.com!
</a>

Tip: To produce equal results in all browsers, always
use hex code to specify colors.

the bgcolor atribute is used to give color to backgroung.

</body>
</html>

The most common HTML lists are ordered and unordered
lists:
HTML Lists

An ordered list:
1. The first list item
2. The second list item
3. The third list item
An unordered list:
 List item
 List item
 List item

HTML Unordered Lists
An unordered list starts with the <ul> tag. Each list item
starts with the <li> tag.
The list items are marked with bullets (typically small black
circles).

example
<ul>
<li>Coffee</li>
<li>Milk</li>
</ul>

How the HTML code above looks in a browser:

• Coffee
• Milk

HTML Ordered Lists
An ordered list starts with the <ol> tag. Each list item starts
with the <li> tag.
The list items are marked with numbers.
example
<ol>
<li>Coffee</li>
<li>Milk</li>
</ol>

How the HTML code above looks in a browser:

1. Coffee
2. Milk

Style Tags/html text formatting

 for underline
 for superscript
 for subscript
 <strike> for striked text</strike>
 for italic text
 for bold text

<html>
<body>
This text is bold
This text is strong
This text is italic
This is subscript and superscript
another example of subscript ans superscript is
(a+b)2=a2+2+2ab
 
chlorine gas formula isCL2
<strike> This is an example of strike out text</strike>
This text is underlined.HTML provides various style
tags>
</body>
</html>

This text is bold
This text is strong
This text is italic
This is subscript and superscript
another example of subscript ans superscript is
(a+b)2=a2+2+2ab
chlorine gas formula isCL2
This is an example of strike out text
This text is underlined.HTML provides various style
tags>

Align Specifies the alignment of a <hr> element
noshadeSpecifies that a <hr> element should render in
one solid color (noshaded), instead of a shaded color
size Specifies the height of a <hr> element
Width Specifies the width of a <hr> element

<html>
<body>
<h1>HTML</h1>
HTML is a language for describing web pages.
<hr>
<h1>CSS</h1>
CSS defines how to display HTML elements.
<hr size=4> it is used to define the thickness of the
line
<hr width= 70%> it defines the width of the line(size)
70% of the page width
<hr width = 50 noshade>here the line is define in pixel
value of 50 and there is no shade given to the line
</body>
</html>

<html>
<body>
<h2>Norwegian Mountain Trip</h2>
<img border="0" src="/images/pulpit.jpg" alt="Pulpit
rock" width="304" height="228">
</body>
</html>

Alt : The required alt attribute specifies an
alternate text for an image, if the image cannot
be displayed.

Height : The height attribute specifies the width of
an image, in pixels.

Width: The width attribute specifies the width of
an image, in pixels.

<html>
<body>
<img src="smiley.gif" alt="Smiley face" width="100"
height="100" border="5">
The border attribute give border to the image in
HTML.you can define the border width as
border="10" 
</body>
</html>

The tag specifies the font face, font size, and font
color of text.

 color: Specifies the color of text
 Size: Specifies the size of text
 Face: Specifies the font of text
 Base font tag: it is used to give default font size ,color,
face to the en
 tire page

The comment tag is used to insert comments
in the source code. Comments are not
displayed in the browsers.

You can use comments to explain your code,
which can help you when you edit the source
code at a later date. This is especially useful if
you have a lot of code.

<html>
<body>



This is a html web page with comments and these comments
are not displayed

</body>
</html>

<html>
<body>
<pre>
This is
preformatted text.
It preserves both spaces and line breaks.

-------------------------------------
Sl no Name
-------------------------------------
1 Ayesha
2 Radhika
-------------------------------------
</pre>
</body>
</html>

The href attribute specifies the URL of the page the
link goes to.
If the href attribute is not present, the <a> tag is not a
hyperlink.
Syntax
<a href="URL">

<html>
<body>

An absolute URL: <a
href="http://www.w3schools.com">

W3Schools</a>
A relative URL: <a href="tag_a.asp">

The a tag</a>

</body>
</html>

If we select the first URL W3 Schools then
the following website will be opened

Else if the selection is
done for the second
URL then following
site will be displayed

Html ppt by Fathima faculty Hasanath college for women bangalore

Recommandé

Recommandé

Contenu connexe

Tendances

Tendances (20)

En vedette

En vedette (6)

Similaire à Html ppt by Fathima faculty Hasanath college for women bangalore

Similaire à Html ppt by Fathima faculty Hasanath college for women bangalore (20)

Dernier

Dernier (20)

Html ppt by Fathima faculty Hasanath college for women bangalore

Notes de l'éditeur