html body { margin-top: 50px !important; } #top_form { position: fixed; top:0; left:0; width: 100%; margin:0; z-index: 2100000000; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; -o-user-select: none; border-bottom:1px solid #151515; background:#FFC8C8; height:45px; line-height:45px; } #top_form input[name=url] { width: 550px; height: 20px; padding: 5px; font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif; border: 0px none; background: none repeat scroll 0% 0% #FFF; }
, headings, paragraphs, lists, tables, and forms. It describes what tags are used for, their attributes, and how they structure and layout content in an HTML document. Various text formatting tags and special characters are also covered. The document aims to teach the basics of HTML through explanations and examples of tags.">
Scribd
Upload
2K views

HTML

This document provides an overview of HTML tags and concepts. It discusses common tags like <html>, <head>, <title>, <body>, headings, paragraphs, lists, tables, and forms. It describes what tags are used for, their attributes, and how they structure and layout content in an HTML document. Various text formatting tags and special characters are also covered. The document aims to teach the basics of HTML through explanations and examples of tags.

Uploaded by

Ghanshyam Sharma
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
2K views

HTML

This document provides an overview of HTML tags and concepts. It discusses common tags like <html>, <head>, <title>, <body>, headings, paragraphs, lists, tables, and forms. It describes what tags are used for, their attributes, and how they structure and layout content in an HTML document. Various text formatting tags and special characters are also covered. The document aims to teach the basics of HTML through explanations and examples of tags.

Uploaded by

Ghanshyam Sharma
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 7

visit @ http://www.infotechcomputer.

in

Chapter 11 & 12 - HTML


HTML : HTML stands for Hypertext Markup Language. It is a document layout and hyperlink specification
language i.e. a language which is used to design the layout of the web document.

Q1. What is a Tag ?


Ans. A Tag is a coded HTML command that indicates how part of web page should be displayed.
Q2. What is an Attribute ?
Ans. An attribute is a special word used inside tag to specify additional information to tag such as color,
alignment etc.
HTML TAGS
1. HTML TAG : This tag identifies that the document is a HTML document. Each and every HTML
document begins with <HTML> and ends with </HTML>
2. HEAD Tag : This tag contains information about the document, including the title, scripts, styles etc.
3. TITLE Tag : This tag contains the document title. The title appears on the title bar of the webpage.
4. BODY Tag : This tag encloses all the tags, attributes and information to be displayed on the webpage.
HTML DOCUMENT STRUCTURE
<HTML>
<HEAD>
<TITLE> . . . . . . . . </TITLE>
</HEAD>
<BODY>
.....
.....
</BODY>

INFOTECH Computer Education, Kishangarh (Raj) 9829171122

Page 1

visit @ http://www.infotechcomputer.in
Q3. What is a container Element ?
Ans. This type of HTML elements require pair tags i.e. a starting tag as well as ending tag.
Q4. What is an empty Element ?
Ans. This type of HTML Elements require just a starting tag and not an ending tag.
BASIC HTML Tags and Thier Attributes
1. HTML Tag : These tags are used to mark the beginning and end of HTML document.
Attributes :
(a) DIR : This attribute specifies in which the browser should present text within the entire document. its
values can be ltr(left to right) or rtl(right to left)
(b) LANG : This attribute specifies the language you have generally used within the document. its values
can be en(english), it(Italian), fr(french) etc.
2. HEAD Tag : It is used to define document header. it contains information about style, script, title etc.
3. TITLE Tag : It contains the document title which will be displayed at the title bar of webpage.
4. BODY Tag : This tag encloses all the tags, attributes and information to be displayed on the webpage.
Attributes :
(a) bgcolor : This attribute is used to specify background color of web page. The color can be specified as
color name or color code. Color codes are combination of six letters and digits starting with # symbol.
digits are between 0 to 9 and letters can be between a to f. few color codes
Aqua : #00FFFF
Black : # 000000 Blue : # 0000FF etc
(b) background : This attribute is used to specify any image to be displayed at the background of
webpage.
(c) text : This attribute is used to specify the text color
(d) link : This attribute is used to specify the link color.
(e) alink : This attribute is used to specify the active link color.
(f) vlink : This attribute is used to specify the visited link color.
(g) leftmargin : It is used to specify the left margin of contents of body tag
(h) topmargin : It is used to specify the top margin of contents of body tag

INFOTECH Computer Education, Kishangarh (Raj) 9829171122

Page 2

visit @ http://www.infotechcomputer.in
5. Hx(x=1 to 6) Tag : HTML has six levels of heading numbered from 1 to 6. Heading 1 is largest and 6 is
smallest.
6. Paragraph Tag : The Tag used for Paragraph is <p> .... </p>
Attributes :
1. Align : This Attributes specifies the alignment of paragraph. values can be left, center, right or justify.
7. Break Tag : The Tag used for this is <br>. This is an empty element and takes the control to the next
line. it has not attributes.
8. Center Tag : It is used to align any contents at the center of page. it starts with <center> and ends with
</center>. It has not attributes.
9. Basefont Tag : This tag lets you define the basic size for the font. it is used with its attribute size whose
value determines the size of text.
Attributes :
1. size : This attribute is used to specify the size of text. size can also be spefied as negative or positive
increment.
2. face : It is used to specify the font name
3. color : It is used to specify the color of font.
10. Font Tag : The tag used for this is <font>......</font>. it is used to change the size, fon and color of
text.
Attributes :
1. face : It is used to specify the font name
2. color : It is used to specify the color
3. size : It is used to specify he font size
11. HR Tag : This tag is used to insert a Horizontal Rule in the webpage.
Attributes :
1. size : it is used to specify the height of Horizontal Rule
2. width : it is used to specify the width of Horizonal Rule
3. noshade : it will display the rule in 2d format
4. color : it is used to specify the color of rule
5. align : alignment of Horizontal Rule

12. Comments <!.... and ...> : This tag is used to specify comments in HTML. comments in HTML are just
like Java. A comment line is not rendered by the browser.
INFOTECH Computer Education, Kishangarh (Raj) 9829171122

Page 3

visit @ http://www.infotechcomputer.in

Various Text Style Tags


12. <b> Tag : This tag is used to specify the Bold Text.
13. <i> Tag : This tag is used to specify the Italics Text.
14. <u> Tag : This tag is used to specify the underline Text.
15. <tt> Tag : This tag is used to specify the Teletype Text.
16. <strong> Tag : This tag is just like bold tag. it makes the text strong or bold
17. <small> Tag : This tag makes the text a bit smaller than normal
18. <big> Tag : This tag makes the text a bit larger than normal text
19. <sup> Tag : This tag makes the text superscript
20. <sub> Tag : This tag makes the text subscript.
Special Characters : In HTML document we have to use various types of special character tags to display
few special characters like
&lt; for < symbol
&gt; for > symbol
&amp; for ampersand sign etc

Chapter 12 HTML - II
List in HTML : There are three types of list in HTML
(a) Numbered List (Also called as Ordered List) - Tag Used is <OL>
(b) Unnumbered List ( Also called as UnOrdered list) - Tag Used is <UL>
(c) Defination List - Tag Used is <DL>
<OL> - This tag is called as Ordered List Tag. Ordered List can be of following Types.
1. Type="1"
2. Type="a"
3. Type="A"
4. Type="i"
INFOTECH Computer Education, Kishangarh (Raj) 9829171122

Page 4

visit @ http://www.infotechcomputer.in
5. Type="I"
<UL> - This tag is called Unordered List Tag. Unordered List can be of following Types.
1. type="disc"
2. type="circle"
3. type="square"
Note : we can use start attributes with OL and UL Tag which is used to specify the starting point of list.
<DL> - This tag is called as Defination List Tag. it is displayed without any bullet symbol. Tags used in
Definatin List are as follows (a) DL - Data List
(b) DT - Data Term
(c) DD - Data Defination
Nested List - When a list is specified within an another list then it is called as nested list.
TABLE Tags in HTML
(a) <table> - This tag is used to create a table it contains all major table attributes
(b) <tr> - This Tag Defines the Table Row
(c) <th> - This tag Defines the Table Heading or Table Header
(d) <td> - This tag Defines the Table Data of Table Cell Contents
(e) <caption> - This tag defines title or caption of the table
(f) <thead> - This tag is used to define a set of header rows.
(g) <tfoot> - This tag is used to define the table footer.
(h) <tbody> - This tag is used to specify the table body.
Attributes of Table Tag
-----------------------------1. Border - it is used to specify the border width
2. BorderColor - it is used to specify the border Color (can be color name or code)
3. Frame - is used to specify frame as table border (values can be - above, below, border, box, hsides,
lhs, rhs, vsides etc)
4. Rules - is used to specify that which borders of table should be visible (values can be all, cols, rows etc)
5. Cellspacing - is used to specify the gap between the table cells
6. Cellpadding - is used to specify the size of a cell
7. Align - is used to specify the alignment of table (values can be left, right, center etc)
8. Background - is used to specify the picture to be displayed as table background
9. Bgcolor - is used to specify the background color or table
10. Height - is used to secify the height of table
11. Width - is used to specify the width of table
INFOTECH Computer Education, Kishangarh (Raj) 9829171122

Page 5

visit @ http://www.infotechcomputer.in
12. summary - is used to specify the summary of table
Attributes of TD Tag
1. Align - is used to specify the alignment of table cell contents
2. Width - is used to define the width of table cell
3. Bgcolor - is used to specify the background color of table cell
4. Background - is used to specify the background picture of table cell
5. Rowspan - is used to specify the row span (rows covered by the cell) of a table cell
6. Colspan - is used to specify the col span (columns covered by the cell) of the table cell
7. Valign - is used to specify the vertical alignment of table cell

HTML FORMS
HTML forms are means to collect information/data from the site-visitor. It is done with the help of
controls that collect the information and send it over
Controls
1. Buttons - There can be three types of Buttons
(a). Submit Button - is activated when we submit the form
(b). Reset Button - is activated when we reset the form
(c). Push Button - this button have no default behavior, we have to write specific script for them
2. Checkboxes - These are toggle buttons that can be on/off. Multiple checkboxes can be selected at a
time.
3. Radiobutton - These are toggle buttons like checkboxes but we can select only one radiobutton at a
time
4. Menus - Menus offer users options from which to choose.
5. Password - This control is used to get password from user. The text entered will not displayed to user.
6. Text Input - A user may create two types of controls to input text. One is Textbox and the other is
TextArea. Textbox is used to enter limited or small text whereas textarea is used for large text
7. Hidden Controls - These are the controls that are not rendered but whose values are submited with a
form.

INFOTECH Computer Education, Kishangarh (Raj) 9829171122

Page 6

visit @ http://www.infotechcomputer.in

How to Create Form Controls


1. Form - <form action="back-end script" method="posting method">
2. TextBox - <input type="text" name="tname" value="Mr." size=20 maxlength=50>
3. Password Box - <input type="password" name="pass">
4. TextArea - <Textarea rows=50 cols=80 name="description"> </Textarea>
5. Submit Button - <input type="submit" name="submit" value="submit">
6. Reset Button - <input type="reset" name="reset" value="reset">
7. Simple Button - <input type="button" value="Click Me">
8. Checkbox - <input type="checkbox" name="hobby1" value="Swimming">Swimming
9. RadioBox -

<input type="radio" name="sex" value="Male">Male


<input type="radio" name="sex" value="Female">Female

10. SelectBox - <select name="stream">


<option>Commerce</option>
<option> Science </option>
<option>Arts</option>
</select>

INFOTECH Computer Education, Kishangarh (Raj) 9829171122

Page 7

You might also like