3 types of Lists:
- Unordered List - lists that do not have a numbered sequence
Example:
<UL>
<LI> …list1…
<LI> …list2…
<LI> …list3…
</UL>
Attribute:
type – type of bullet
<LI type=”square|circle|disc”> … list1
Or
<UL type=” square|circle|disc”>
- Ordered List – allows you to create a list of numbered or ordered items.
Example:
<OL type=”a|A|1|I|i” start=”{integer}>
<LI> …list1…
<LI> …list2…
<LI> …list3…
</OL>
Attribute:
type – type of numbering (default type: numbers)
start – an integer value where the numbering starts
- Definition List – used to create a special kind of list similar to a glossary
Example:
<DL>
<DT> Term 1
<DD> Definition 1
<DT> Term 2
<DD> Definition 2
</DL>
Colors and Background:
Syntax:
<BODY bgcolor=”English-Color-Name”
background=”URL-to-graphic-file”
text= “Color|#RRGGBB”
link=”Color|#RRGGBB”
alink=” Color|#RRGGBB”
vlink=” Color|#RRGGBB”>
Where:
alink – color of the link that are/is currently in use
vlink – previously visited link
Fonts
Syntax:
<FONT color=”English-Color-Name|#RRGGBB”
face=”Font-Family|Generic-Font-Name”
size=”1 to 7 (default(3)|+1 to +6|-1 to -6”>
:
Text
:
</FONT>
Images
Syntax:
<IMG align=”buttom|left|middle|right|top”
border=”integer pixel”
height=”integer pixel”
width=” integer pixel”
src=”URL-of-image”
hspace=” integer pixel”
vspace=” integer pixel”>
Where:
hspace – horizontal space around the picture
vspace – vertical space around the picture
height & width – dimension of the picture
Links and Addressing
Anchor Element – implements hyperlinking capabilities
Syntax:
<A href=”URL” name=”string”
target=”_blank|_parent|_self|_top|frame-name”
title=”advisory text”>
:
Linkable text/content
:
</A>
Example:
<A href=”http://learninghtmlbasic.blogspot.com/”> Learn HTML Basic </A>
Linking using pictures:
<A href="http://learninghtmlbasic.blogspot.com/”>
<IMG src=”/mypicture.jpeg” height=”100” width=”100”>
</A>
Linking within a page:
<A name=”top”> </A>
<A href=”#top”> Go to TOP </A>
Markers from other document:
<A href=”mypage.html#middle”>
Links to the middle of mypage.html document
</A>
Sample Code:
<HTML>
<TITLE>HTML Example 2</TITLE>
<BODY bgcolor="pink">
<UL>
<LI type="square"> Unordered List 1
<LI type="circle"> Unordered List 2
<LI type="disc"> Unordered List 3
</UL>
<OL type="1" start="1">
<LI> Ordered List 1
<LI> Ordered List 2
<LI> Ordered List 3
</OL>
<FONT color="yellow" face="arial" size="4">
<DL>
<DT> Term 1
<DD> Definition 1
<DT> Term 2
<DD> Definition 2
</DL>
</FONT>
<IMG align="right" border="2" height="320" width="320" src="html.jpg">
<A href="http://www.google.com/">Go to Google</A>
<br>
<A href="http://learninghtmlbasic.blogspot.com/">Learn HTML Basic</A>
</BODY>
</HTML>
<TITLE>HTML Example 2</TITLE>
<BODY bgcolor="pink">
<UL>
<LI type="square"> Unordered List 1
<LI type="circle"> Unordered List 2
<LI type="disc"> Unordered List 3
</UL>
<OL type="1" start="1">
<LI> Ordered List 1
<LI> Ordered List 2
<LI> Ordered List 3
</OL>
<FONT color="yellow" face="arial" size="4">
<DL>
<DT> Term 1
<DD> Definition 1
<DT> Term 2
<DD> Definition 2
</DL>
</FONT>
<IMG align="right" border="2" height="320" width="320" src="html.jpg">
<A href="http://www.google.com/">Go to Google</A>
<br>
<A href="http://learninghtmlbasic.blogspot.com/">Learn HTML Basic</A>
</BODY>
</HTML>
Sample Output:
No comments:
Post a Comment