<Body> Tag
The body tag defines the document’s body. It contains all the
contents of an HTML document such as text, images, list,
tables, hyperlinks, etc.
Attribute – Background
Usage:html
<Body background = "path\\filename.extension">
or
<Body background = "filename.extension">
Example:
<Body background = "myimg.jpg">
To add a background image on an HTML element, use:
CSS – Inline
<Body style = "background-image: url('filename.extension')">
Internal
<head>
<style>
Body {
background-image: url('filename.extension');
}
</style>
</head>
Background Color (Bgcolor) / Text Color (Text) / Link
Color (Link)
By default, browsers display text in black on a grey/white
background.
1. Attribute – Bgcolor
This attribute is used to change the color of the background of
the web page.
Syntax:
<tag bgcolor = "value">
Example:
<Body bgcolor = "red">
<Body bgcolor = "#FF0000">
<h1 bgcolor = "yellow">class 10 ……………</h1>
2. Text Color – Attribute
We can change the color of text.
Syntax:
<tag text = "value">
Example:
<P text = "magenta">This is paragraph</P>
3. Link – Link / vlink – Attribute
We can change the color of links.
vlink refers to visited links and
alink refers to active links.
Note:
We can also use multiple attributes in a single tag.
Example:
<Body bgcolor = "red" text = "magenta" link = "yellow" vlink =
"lime" alink = "red">
Hex:
The six-digit number and letter combinations represent colors
by giving their RGB (Red, Green, Blue) values.
Actually, these six digits are sequels representing the amount
of red, green, or blue as hexadecimal value in the range 00–FF.
Left Margin – Attribute
The margin refers to the blank area left from the edge of page.
If you want to leave some blank area on the left side, you can
use leftmargin attribute.
Example:
<Body leftmargin = "value">
<Body leftmargin = "60">
Top Margin – Attribute
The value is the number of pixels. Similarly, to set the top
margin:
<Body topmargin = "value">
<Body topmargin = "70">
Heading Tag (H1 – H6)
HTML has six levels of headings. H1 to H6.
H1 represents different levels of heading.
H1 has longer and bolder fonts than H2 and so on.
These are differentiated from each other through these factors
— typeface, point size, and the space above and below them.
Attribute: Align
align = left / right / center
<Body>
<H1> Level 1 Heading </H1>
<H2 align = left> Level 2 Heading </H2>
<H3 align = right> </H3>
<H4 align = center> </H4>
</Body>
Text Formatting Using <P> and <BR> tags
<P> Tag is used to write the text in a paragraph.
The browser do not recognized returns. The browser do not see
tabs or even more than one space between letters.
<BR> tag
This tag is empty tag that means they do not come in pair. To
simply end one line and jump to the next, use a line break
<BR>.
Attributes:
None
Changing paragraph Alignment
Align attribute
The text that you type between <P> and </P> tags is by
default left aligned.
To change the alignment, you can use ALIGN attribute of <P>
tag.
<P align = left / right / center >
Note:
Align attribute of <P> tag is not supported in HTML5
The <Center> Tag (Not supported in HTML5)
To centralize a segment of text, an alternative way is to use
<Center> tags.
<center> --------- </center>
<BASEFONT> and <FONT> - Text Formatting
(Not supported in HTML5)
<BASEFONT> tag lets you define the basic size for the font the
browser will use to render a document. That is, the text for
which no other font-size setting has been provided.
The size can have an absolute value from 1 to 7 → e.g., size = 5
<BODY>
</BASEFONT> </BASEFONT>
Ex:<BODY>
This text is being displayed in default font size as no Basefont
size.
<BASEFONT size=5>
This text has Basefont size 5.
<BASEFONT size = +2>
This text has relatively 40% (means 7) bigger size than the
earlier one.
<BASEFONT size = -1>
This text has relatively 20% (means 6) smaller size than the
earlier one.
</BaseFont> is optional
<BODY>
Important: <FONT> Tag (Not supported in HTML5)
<FONT> tag lets you change size, style, and color of text.
The value of the size attribute of <FONT> must be one of the
virtual font sizes (1–7).
<BODY>
<FONT size = 7 color = red>U</FONT>
<FONT size = 4 or 5 color = blue>
Using the largest font for the first character of a paragraph!
</FONT>
</BODY>
<FONT> FACE Attribute
You can also change font type of the text you are displaying.
This can be done by using face attribute.
<FONT face = "Broadway, Arial, Times New Roman">
Notice the font type of this text.
</FONT>
In font Broadway, if your browser is not support, otherwise in
Arial, if Arial font is not supported by your browser then it
displays text in Times New Roman.
By default font = render
If no font name given in the list is supported by the browser,
then the browser renders the text in its default font.
Difference between <BASEFONT> and <FONT>
<BASEFONT> tag takes the same attributes as <FONT> but
affects all the text that follows it until a new tag affecting that
is encountered.
<FONT> only affects text up to closing the </FONT>.
Horizontal Rule = <HR> tag
<HR> tag produces a horizontal line spread across the width of
the browser.
Attributes =
Size (Thickness)
Width
No shade
Color
By default, size of horizontal rule is 3 pixels.
<HR size=4 width="100%">
Various Attributes of <HR>
The <HR> horizontal rule appears as 3D rules – 2D rule just
add noshade to <HR>
<Body>
<P>
<HR size = 3D noshade>
<HR width = 30%>
<HR color = "Red">
<HR align = (left / right / center)> <!-- Not supported in
HTML5 -->
</P>
</Body>
Note: All these attributes are obsolete (removed) in HTML5.
You need to use CSS instead.
Comments <!-- and -->
Comments are one type of textual content which appears in
your HTML code but are not rendered by the user's browser.
Comments are given between special <!-- and --> markup
element.
Browsers ignore the text between comment character
sequences.
Some Logical and Physical Text Styles
Logical Style
<DFN> → displayed in Italics
<EM> → Emphasis – *italic*
<CODE> → for computer code
<STRONG> → display in bold
Physical Text Style
<B> ---------</B>
<I> -------------</I>
<U> --------------</I>
<TT> → Typewriter text</TT>
Subscript and Superscript
To write something like H₂O, you can write it:
H₂O → H<sub>2</sub>O
E = MC² → E = MC<sup>2</sup>
Special Characters
Three ASCII Characters:
< → the escape sequence for <
> → >
& → &
" → "
Combining Tags
HTML allows you to combine various tags together so as to
achieve the desired result and effect – you can try and combine
many tags.
<H1> <FONT color = blue> Heading 1 </FONT> </H1>
Lists in HTML
There are three list types of lists in HTML:
1. Unnumbered – Unordered list <UL>
2. Numbered – Ordered list <OL>
3. Definition
The lists may be nested as well.
Unnumbered or Unordered List or Bulleted List
These lists are marked by <UL> and <LI> tags.
To make an unnumbered list:
1. Start with an opening list <UL> tag.
2. Enter the <LI> (list item) tag followed by the individual item
→ no closing </LI> tag is needed.
3. End the entire list with a closing list </UL> tag.
Example:
<UL>
<LI> apples
<LI> bananas
</UL>
Output:
apples
bananas
