Download presentation
Presentation is loading. Please wait.
1
Tag Basics
2
General Structure of HTML page
1. Page Structure <HTML> <HEAD> <TITLE> </TITLE> </HEAD> <BODY> </BODY> </HTML> General Structure of HTML page At a minimum, HTML document should contain 3 basic sets of tags
3
attributes of <BODY> tag
Background = "URL" Sets the background image to the image found at URL The image should be in .gif, .jpg, or .jpeg format Example: <BODY Background = “C:/images/abc.gif”>
4
bgcolor = “#RRFFBB" OR “……..”
attributes of <BODY> tag (ii) bgcolor = “#RRFFBB" OR “……..” Indicates the color of a document’s background The value of this attribute can be a hexadecimal number, an RGB value, or a color name Example: <body bgcolor="#000000"> <body bgcolor="RGB(0,0,0)"> <body bgcolor="black"> The lines above all set the background-color to black.
5
attributes of <BODY> tag
(iii) LEFTMARGIN = “n” Specifies the width (in pixels) of a margin (left edge) Example: <body leftmargin = “30” > . (iv) TOPMARGIN = “n” Specifies the size (in pixels) of a margin (top edge) Example: <body topmargin = “30” >
6
attributes of <BODY> tag
(v) LINK = “#RRFFBB" OR “……..” Indicates the color of hyperlinks text within the document (vi) TEXT = “#RRFFBB" OR “……..” Indicates the color of normal text within the document Example: <body bgcolor="#FFFFFF” text =“blue“ link =“red">
7
2. Adding Comments The comment tag is used to insert a comment in the HTML source code. A comment can be placed anywhere in the document and the browser will ignore everything inside the brackets. HTML comments are placed in between <! > tags. Example: <!-- This is a comment -->
8
3. Working with Texts To display text, it must be between the <BODY> and </BODY> tags. Browser ignores every tab, carriage return, extra space placed in the text Only HTML tags can format a web page Example: <BODY> <CENTER> HELLO WORLD </CENTER> </BODY>
9
4. Paragraph and Line Breaks
The <p> tag defines a paragraph Browsers automatically add some space (margin) before and after each <p> tag. Example: <p>This is some text in a paragraph.</p>
10
4. Paragraph and Line Breaks
Attributes of <p> tag 1) ALIGN = {LEFT, RIGHT, and CENTER} The align attribute is used to set the alignment of the paragraph with respect to the page size. Example: <p align="center">
11
4. Paragraph and Line Breaks
Attributes of <p> tag 2) width = “n” Specifies the horizontal dimension of the paragraph (in pixels) Example: <p width= 250 >
12
4. Paragraph and Line Breaks
The <br> tag inserts a single line break. The <br> tag is an empty tag which means that it has no end tag. Example: <br>This is some text
13
5. Emphasizing Text <b> - Bold text
<strong> - Important text <i> - Italic text <em> - Emphasized text <mark> - Marked text <small> - Small text <sub> - Subscript text <sup> - Superscript text
14
5. Emphasizing Text
15
6. Heading and Horizontal Rules
The <h1> to <h6> tags are used to define HTML headings. <h1> defines the most important heading. <h6> defines the least important heading. ALIGN= {LEFT, RIGHT, and CENTER} <h1 align="center">This is heading 1</h1>
16
6. Heading and Horizontal Rules
Output: Heading – Example:
17
6. Heading and Horizontal Rules
Horizontal Rules - Example The HTML <hr> tag is used for creating a horizontal line. This is also called Horizontal Rule in HTML.
18
6. Heading and Horizontal Rules
Horizontal Rules - Example
19
6. Heading and Horizontal Rules
Attributes of Horizontal Rules Attribute Value Description align left, right, center Specifies the alignment of the horizontal rule. noshade Removes the usual shading effect that most browsers display. size pixels or % Specifies the height of the horizontal rule. width Specifies the width of the horizontal rule.
Similar presentations
