PPT on Basic HTML Tags
5,976 views
17 slides
Jun 24, 2019
Slide 1 of 17
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
About This Presentation
Here, in the above PPT, I am providing basic use of some important HTML Tags (WEB TECHNOLOGY)
Slide Content
BASIC HTML TAGS
FROM
WEB TECHNOLOGY
SUBMITTED BY
VINITA PALIWAL
FROM
WEB TECHNOLOGY
SUBMITTED BY
VINITA PALIWAL
Outlines
•HTML TAGS
•STRUCTURAL TAGS
•HEADER TAGS
•BREAKING LINE, PARAGRAPH AND HORIZONTAL
LINE
•TEXT FORMATTING TAGS
• LINKS AND GRAPHICS
•ABBREVIATION TAG
•LISTS TAGS
•HTML TAGS
•STRUCTURAL TAGS
•HEADER TAGS
•BREAKING LINE, PARAGRAPH AND HORIZONTAL
LINE
•TEXT FORMATTING TAGS
• LINKS AND GRAPHICS
•ABBREVIATION TAG
•LISTS TAGS
HTML TAGS
HTML markup tags are usually called HTML tags
HTML tags are keywords surrounded by angle brackets
like <html>
HTML tags normally come in pairs like <b> and </b>
The first tag in a pair is the start tag, the second tag is the
end tag
Start and end tags are also called opening tags and closing
tags
HTML markup tags are usually called HTML tags
HTML tags are keywords surrounded by angle brackets
like <html>
HTML tags normally come in pairs like <b> and </b>
The first tag in a pair is the start tag, the second tag is the
end tag
Start and end tags are also called opening tags and closing
tags
Structural Tags
•<HTML> -- This tag enclose the entire Web page
document.
</HTML>
•<HEAD>-- This tag enclose the Head part of the document
</HEAD>
•<TITLE>--This tag enclose the title of the document. This
text appears in the title bar in the browser and on the
bookmark list if someone bookmarks your web page.
</TITLE>
•<BODY>--This tag contains the visible elements of
page.
</BODY>
•<HTML> -- This tag enclose the entire Web page
document.
</HTML>
•<HEAD>-- This tag enclose the Head part of the document
</HEAD>
•<TITLE>--This tag enclose the title of the document. This
text appears in the title bar in the browser and on the
bookmark list if someone bookmarks your web page.
</TITLE>
•<BODY>--This tag contains the visible elements of
page.
</BODY>
Sample Structure of Tags
<HTML>
<HEAD>
<TITLE> DOCUMENT </TITLE>
</HEAD>
<BODY>
This is my first web page.
</BODY>
</HTML>
<HTML>
<HEAD>
<TITLE> DOCUMENT </TITLE>
</HEAD>
<BODY>
This is my first web page.
</BODY>
</HTML>
Header Tags
Header Tags -- Used for marking sections and subsections in a
document.
<H1>Header 1 -- Giant-sized and bold </H1>
<H2>Header 2 -- Large and bold </H2>
<H3>Header 3 -- Normal-sized and bold </H3>
<H4>Header 4 -- Small and bold </H4>
<H5>Header 5 -- Very Small and bold </H5>
<H6>Header 6 -- Tiny and bold </H6>
Header Tags -- Used for marking sections and subsections in a
document.
<H1>Header 1 -- Giant-sized and bold </H1>
<H2>Header 2 -- Large and bold </H2>
<H3>Header 3 -- Normal-sized and bold </H3>
<H4>Header 4 -- Small and bold </H4>
<H5>Header 5 -- Very Small and bold </H5>
<H6>Header 6 -- Tiny and bold </H6>
Header Tags (cont.)
H1 = Giant-sized and bold
H2 = Large and bold
H3 = Normal-sized and bold
H4 = Small and bold
H5 = Very Small and bold
H6 = Tiny and bold
H1 = Giant-sized and bold
H2 = Large and bold
H3 = Normal-sized and bold
H4 = Small and bold
H5 = Very Small and bold
H6 = Tiny and bold
Breaking Lines, Paragraphs and
horizontal line
•The <HR> tag
It puts a horizontal line across the page.
Ex:
•<P> text </P>
–Paragraph tag.
•<BR>
–Line break tag.Example: text a
<p>text a</p>
<p>text b</p> text b
<br>text c
<br>text d text c
text d
horizontal line
•The <HR> tag
It puts a horizontal line across the page.
Ex:
•<P> text </P>
–Paragraph tag.
•<BR>
–Line break tag.Example: text a
<p>text a</p>
<p>text b</p> text b
<br>text c
<br>text d text c
text d
Text Formatting Tags
Some basic text formatting styles:
Tag Result
<I> Italics </I> Italics
<B> Bold </B> Bold
<PRE> Preformatted Text </PRE>
Preformatted Text
<STRONG> Strong </STRONG> Strong
<ADDRESS> Address </ADDRESS> Address
<CODE> Source Code </CODE> Source Code
Some basic text formatting styles:
Tag Result
<I> Italics </I> Italics
<B> Bold </B> Bold
<PRE> Preformatted Text </PRE>
Preformatted Text
<STRONG> Strong </STRONG> Strong
<ADDRESS> Address </ADDRESS> Address
<CODE> Source Code </CODE> Source Code
Contd.
<mark>Mark<mark> highlights the text
<small>Small<small> small text
<em>Emphasized text<em> emphasize the text
<del>Delete<del> delete text
<ins>Insert<ins> insert a line under text
<mark>Mark<mark> highlights the text
<small>Small<small> small text
<em>Emphasized text<em> emphasize the text
<del>Delete<del> delete text
<ins>Insert<ins> insert a line under text
Links
The anchor tag <A> is used to link one document to another or from one
part of a document to another part of the same document.
Basic Links:
<A HREF=“file address”</A>
Graphics
To have a graphic/image appear on a webpage, put the <IMG>
tag in with the address where the graphic "lives":
<IMG SRC="http://www.someplace.com/images/fish.gif">
The anchor tag <A> is used to link one document to another or from one
part of a document to another part of the same document.
Basic Links:
<A HREF=“file address”</A>
Graphics
To have a graphic/image appear on a webpage, put the <IMG>
tag in with the address where the graphic "lives":
<IMG SRC="http://www.someplace.com/images/fish.gif">
<addr>--defines abbreviation
Lists -- Unordered Lists
Unordered lists:
<UL>
<LI>Item One
<LI>Item Two
<LI>Item Three
<LI>Item Four
</UL>
• Item One
• Item Two
• Item Three
• Item Four
Unordered List Attributes:
type="disc/circle/square"
• Disc (default) Circle Square
Unordered lists:
<UL>
<LI>Item One
<LI>Item Two
<LI>Item Three
<LI>Item Four
</UL>
• Item One
• Item Two
• Item Three
• Item Four
Unordered List Attributes:
type="disc/circle/square"
• Disc (default) Circle Square
Lists -- Ordered Lists
<OL>
<LI> Item One
<LI> Item Two
<LI> Item Three
<LI> Item Four
</OL>
1. Item One
2. Item Two
3. Item Three
4. Item Four
type="i/I/a/A/1" (default)
i = i. Item OneI =I. Item Onea =a. Item OneA =A. Item One1 =1.Item One
ii. Item Two II. Item Two b. Item Two B. Item Two 2. Item Two
iii. Item Three III. Item Threec. Item Three C. Item Three 3. Item Three
iv. Item FourIV. Item Fourd. Item Four D. Item Four 4. Item Four
Ordered (Numbered) Lists:
Ordered List Attributes:
<OL>
<LI> Item One
<LI> Item Two
<LI> Item Three
<LI> Item Four
</OL>
1. Item One
2. Item Two
3. Item Three
4. Item Four
type="i/I/a/A/1" (default)
i = i. Item OneI =I. Item Onea =a. Item OneA =A. Item One1 =1.Item One
ii. Item Two II. Item Two b. Item Two B. Item Two 2. Item Two
iii. Item Three III. Item Threec. Item Three C. Item Three 3. Item Three
iv. Item FourIV. Item Fourd. Item Four D. Item Four 4. Item Four
Ordered (Numbered) Lists:
Ordered List Attributes:
Lists -- Definition Lists
Definition Lists:
<DL>
<DT>List Name One
<DD>This is where information about List Name One would go.</DD>
</DT>
<DT>List Name Two
<DD>This is where information about List Name Two would go.</DD>
</DT>
</DL>
List Name One
This is where information about List Name One
would go.
List Name Two
This is where information about List Name Two
would go.
Definition Lists:
<DL>
<DT>List Name One
<DD>This is where information about List Name One would go.</DD>
</DT>
<DT>List Name Two
<DD>This is where information about List Name Two would go.</DD>
</DT>
</DL>
List Name One
This is where information about List Name One
would go.
List Name Two
This is where information about List Name Two
would go.
Categories
EducationDownload
Download Slideshow Get the original presentation fileQuick Actions
Statistics
- Views 5,976
- Slides 17
- Favorites 2
- Age 2351 days
Related Slideshows
11
TLE-9-Prepare-Salad-and-Dressing.pptxkkk
MaAngelicaCanceran
30 views
12
LESSON 1 ABOUT MEDIA AND INFORMATION.pptx
JojitGueta
24 views
60
GRADE-8-AQUACULTURE-WEEKQ1.pdfdfawgwyrsewru
MaAngelicaCanceran
39 views
26
Feelings PP Game FOR CHILDREN IN ELEMENTARY SCHOOL.pptx
KaistaGlow
39 views
![Jeopardy_Figures_of_Speech_Template.pptx [Autosaved].pptx](https://slidepub.com/thumb/5828/284015828.jpg)
54
Jeopardy_Figures_of_Speech_Template.pptx [Autosaved].pptx
acecamero20
23 views
7
Jeopardy_Figures_of_Speech.pptxvdsvdsvsdvsd
acecamero20
24 views