PHOENIX PODAR LEARN SCHOOL BARSHI
ELEMENTARY HTML
Notes
Basic of Elementary HTML – Short Notes
1. HTML (HyperText Markup Language)
o It is used to create web pages.
o It uses tags to structure content.
2. Basic Structure of HTML
<html>
<head>
<title>Page Title</title>
</head>
<body>
Content goes here
</body>
</html>
3. Main Tags
o <html> – Root of the webpage
o <head> – Contains information about the page
o <title> – Sets the page title
o <body> – Contains visible content
4. <body> Tag (Body Tag): The <body> tag defines the main content
area of an HTML page — everything inside it is visible on the
browser. It comes after the <head> tag and before the closing
</html> tag.
Common Attributes of <body> Tag
bgcolor – Sets background color of the page.
background – Sets an image as the background.
text – Sets the color of the text.
link – Sets color of hyperlinks.
vlink – Sets color of visited links.
alink – Sets color of active (clicked) links.
Example combining attributes:
<body bgcolor="lightyellow" text="darkblue" link="green"
vlink="purple" alink="red">
<h2>Example Webpage</h2>
<p>Welcome to my colorful webpage!</p>
<a href="[Link] Here</a>
</body>
5. Text Formatting Tags
o <h1> to <h6> – Headings
o <p> – Paragraph
o <b> – Bold text
o <i> – Italic text
o <u> – Underlined text
o <br> – Line break
o <hr> – Horizontal line
6. <HR>Tag (Horizontal Rule Tag)
o The <hr> tag is used to insert a horizontal line (a divider) in a
webpage.
o It is an empty tag (no closing tag).
<hr color="blue" size="4" width="60%" align="center" noshade>
o color – Sets the color of the line.
size – Sets the thickness (height) of the line.
width – Sets the width of the line (in % or pixels).
align – Aligns the line (left, center, right).
noshade – Removes 3D shading (makes it solid).
7. <font> Tag
The <font> tag is used to change the font style, size, or color of text.
It is a container tag (needs a closing tag).
<font color="green" size="5" face="Verdana">Welcome to HTML!</font>
color – Sets the color of the text
size – Sets the size of the text (1–7).
face – Sets the font style (name).
8. Links and Images
o <a href="url"> – Creates a hyperlink
o <img src="[Link]" alt="text"> – Displays image
9. Comments
o <!-- This is a comment -->
10. Container Tags
o Have both opening and closing tags.
Example: <p>Text</p>
11. Empty Tags
o Have only an opening tag.
Example: <br>, <hr>, <img>
12. Superscript (<sup>) Tag: The <sup> tag is used to display text
slightly above the normal line.
It is commonly used for powers or ordinal indicators.
Example:
X<sup>2</sup> + Y<sup>2</sup> = Z<sup>2</sup>
Output: X² + Y² = Z²
13. Subscript (<sub>) Tag: The <sub> tag is used to display text
slightly below the normal line.
It is commonly used in chemical formulas.
Example:
H<sub>2</sub>O
Output: H₂O
[Link] in the blanks.
1. Attribute is a keyword used inside the tag to specify additional
information about the tag.
2. A tag that requires an opening as well as a closing tag is called
a container tag.
3. The <!DOCTYPE> tag identifies the document as an HTML document.
4. The <TITLE> tag provides additional information like title about a web
page.
5. There are six different types of heading tags in HTML.
[Link] T for True and F for False Statements
1. T : HTML stands for HyperText Markup Language.
2. F : The tag used to begin and end a web page is <HTML>...</END>.
3. T : The <TITLE> tag can be placed anywhere in the HTML document
(It must be inside <HEAD>).
4. T : The <HEADER> tag automatically includes a line break.
5. F : HTML language ignores white spaces (It does not).
[Link] the Correct Option
1. Which tag inserts a line horizontally?
Answer: <HR>.
2. What should be the first tag in any HTML document?
Answer: <HTML>.
3. Correct HTML tag to make text italic:
Answer: <I>.
4. Correct HTML tag for the smallest size heading:
Answer: <H6>.
5. What does VLINK attribute mean?
Answer: Visited link.
[Link] the Following.
Column A Column B
1. HTML b. markup language
Column A Column B
2. HTML uses e. pre-specified tags
3. Page designed in HTML a. web page
4. Internet explorer f. browser
5. Attribute of <HR> tag c. width
6. Attribute of <BODY> d. Vlink
[Link] Single Line Code
1. Theoretically you can nest as many lists as you like:
<ul><li><ul><li></li></ul></li></ul>.
2. Lists types:
<ol></ol> <ul></ul>.
3. HyperText Markup Language:
Hyper Text Markup Language (Simply write as text or acronym for
HTML).
[Link] the following questions.
1. What is the full form of HTML? Explain the three parts of the HTML
document.
● HTML stands for HyperText Markup Language. The three parts of an
HTML document are:
● HTML Tag: <html> tag encloses the entire document.
● Head Tag: <head> contains meta-information, title, and links to
scripts or styles.
● Body Tag: <body> contains the content that is displayed in the
browser.
2. Name any two attributes of the following tags:
● a. <BODY>: bgcolor, text
● b. <FONT>: size, color.
3. Explain container tags. Name any two container tags.
● Container tags have both opening and closing tags, enclosing content
between them. Examples: <html></html>, <body></body>.
4. How do you insert the line and paragraph break?
● To insert a line break, use the <br> tag.
● To insert a paragraph break, use the <p> tag.
5. What are HTML tags?
● HTML tags are special keywords enclosed in angle brackets (< >) used
to define elements within a web page. They instruct the browser how
to display content.
6. Differentiate between the container and the empty elements.
● Container elements have both opening and closing tags and enclose
content. Example: <p>Text</p>.
● Empty elements are self-closing and do not have any content or
closing tag. Example: <br>, <img>.
7. Name parameter of the <HEAD> tag and the attributes of
the <BODY> tag.
● Parameter of <HEAD> tag: <TITLE>, <META>, <LINK> (these are tags
used inside <HEAD>)
● Attributes of <BODY> tag: bgcolor, text, background, alink, vlink.
8. Explain ALINK and VLINK attributes of the <BODY> tag.
● ALINK: sets the color of an active hyperlink.
● VLINK: sets the color of a visited hyperlink.
___________________________*_________________*___________
