HTML NOTES
HTML stands for hypertext markup [Link] is used to prepare webpages. It is a tag based language.
Tags:- Tags are the instruction to web browser which tells the browser that what to show and how to show on
[Link] also knows as elements.
It has two types:-
1. Container tag:-Whish needs to ON and OFF or open and close. Eg.<html></html>
2. Empty tag:- which needs to open only no need to [Link] <br><hr>
Attributes of tags:- Attributes are the properties of a tag. A tag can open with an attribute but can never close with
attribute. Ex:- <font color=”red” face=”monotype corsiva” size=8></font>
Here font is a tag and color ,size, and face are its attributes.
Structure of HTML document
<html>
<head>
<title>tile of the page</title>
</head>
<body>
Body of the web page
</body>
</html>
Tools for web publishing for html:-Text editor i.e notepad for html coding and a web browser i.e Google
Chrome, Edge, Mozila firefox, internet explorer or any other to check your creation.
Extension for html document is :- .html or .htm
Tags and their different uses as following
<html>:- This is the starting tag of an html document.
<head>:- This tag contain the general information about the document.
<title>:- This tag contain the title which will be displayed on browser’s title bar.
<body>:- This is that from where the actual body of a web page will start.
What is the Difference between font and basefont tag?
<basefont>:- this is an empty element which is used to change the color size face of whole web page. Whereas
<font> tag is used to change the font color face size of the particular text. it is a container element.
Example with attributes:-<font color=”red” face=”arial black” size=2>
Example with attributes:-<basefont color=”red” face=”arial black” size=2>
What is the difference between bgcolor and background attribute of body tag?
Bgcolor is used to apply the own choice background color on web page. Example <body bgolor=”yellow”>
Whereas Background is used to apply own choice image as a background.
Example <body background=”[Link]”>
Explain the use of the following tag:
ALINK: Stands for active link, attribute of body tag to change the color of active link. <body alink=
“green”>
VLINK: Stands for visited link, attribute of body tag to change the color of visited link. <body vlink=
“black”>
LINK :- attribute of body tag to change the color of visited link. <body link= “red”>
Top,bottom,left,right margin:- All are the attribute of body use to change the margin from any side
left,right,top,bottom.
Syntax:- <body topmargin=50>
Text:- This is also the attribute of body tag used to change the text color of whole webpage.
<body text=”red”>
<p> tag:- this tag is used to start a paragraph on web page. Align is its attribute. It has four alignments
(left ,right,center,justify) <p align=”center”>
<center>It is used to make the text or an object on the center of the web page.
<br>:- It is an empty element which is used to break a line and start or display the text on next line.
<hr> it is an empty element used to draw a horizontal row on web page. The following are its attributes:-
Align,noshade,size,width,color.
Example with attributes:-<hr color=”red” align=”center” size=”10” width=”50%”>
<hr noahde> this will display the line in grey color without any shade.
HEADING TAG:- There are six heading levels in HTML from <h1>to <h6>. It displays the text larger to
smaller.<h1> is the largest and so on.
Ex:-<h1>wel come</h1> same you can use up to <h6>
FORMATTING TAGS:
<b>to bold the text on web page</b>
<i>to italic the text on web page</i>
<u> to underline the text on web page</u>
<em>same as italic</em>
<tt>display the text as typewriter font</tt>
<pre> this tag is used to retain the blank space by default browser ignore the white or blank space.
<strike>display the text in strike through</strike>
<sub>It display the text slightlty below the line. Ex:-CO2 CO<sub>2</sub>
<sup>it displays the text slightly above the [Link]:-X2 X<sup>2</sup>
Lists in HTML
<ol> Ordered list is used to start an ordered list on web page like numeric, alphabet or roman orders.
<ul> Unordered list is used to prepare an unordered list on web page. Like disc square circle.
<li> >list item tag is used to define the list items either in ordered or an ordered list.
Example of ordered list Example of ordered list
<ol> <ul>
<li>red</li> <li>red</li>
<li>yellow</li> <li>yellow</li>
<li>purple</li> <li>purple</li>
</ol> </ul>
<dl> this is used to define definition/description list in html.
<dt>It stands for define term in definition list.
<dd>It stands for data description in definition list.
Ex:-
<dl>
<dt>Sachin Tendulkar</dt>
<dd>God of cricket</dd>
<dt>Virat Kohli</dt>
<dd>King Kohli</dd>
</dl>
Nested list:- A list within a list is called nested list.
<img src>This tag is used to apply an image on web [Link] is an empty element.
Example<img src=”[Link]”>
Image support to the web browser are:-JPG,JPEG,GIF,PNG,BMP.
<table>It is used to prepare a table on web page
<caption>it is used to give caption of table
<th> it is used to give column heading in table.
<td> it is used to fill data in table
<tr>it is used to create a row in table.
What is the use of colspan and rowspan in html?
Colspan is used to merge the columns and make it a single cell. Example <td colspan=”3”>. Whereas Rowspan is
used to merge the rows and make it a single cell. Example <td rowspan=”3”>
What is the difference between cell spacing and cellpadding in html?
The space between two adjacent cells is called cell spacing. Whereas the cell padding is the difference between cell
border and text.
Example <table cellspacing=10 cellpadding=10>
What is the difference between internal linking and external linking in html?
Jump on the same page on link click is an internal lining whereas jump on different web page on link click is
known as external linking.
<A>It stands for anchor tag it is used to prepare a hyperlink on webpage.
Syntax to define the internal link:-
<a name=”top”>top</a>
<a href=”#top”>move to top</a>
External linking:<a href=”URL”>link name</a>