HTML supports 3 different type of the list
a) Unordered list
b) Ordered list
c) Definition list
Unordered list:
An unordered list is defined using <ul> individual list items in the unordered list are defining using <li> both <ul> and <li> are container tags. Type attribute <ul> has a type attribute which specifies the type of the bullet values which can be assigned to this attribute are disc (default setting), circle, square. This attribute can also be given with <li> for changing the bullet type of individual list item.
Examples:
i) <body>
<ul>
<li> Arts </li>
<li> Commerce </li>
<li> Science </li>
</ul>
</body>
ii)
<body>
<ul>
<font color=red>
<li>Red</li>
</font>
<font color=green>
<li type=Square> Green </li>
</font>
<font color=blue>
<li type=circle> Blue </li>
</font>
<font color=magenta>
<li type=circle> Magenta </li>
</font>
</body>
Ordered list:
An ordered list is a numbered list which can be defined using <ol> individual list items in an ordered list are defined using <li>. Both <li> are container tag.
Type attribute: - It is used to control the numbering scheme.
Type=A is used for Uppercase Alphabets
Type=a is used for Lowercase Alphabets
Type=I is used for Uppercase Roman Numerals
Type=i is used for Lowercase Roman Numerals
Type=&[default setting] is used for Numbers
Examples:
<body>
<ol type=I start=101>
<li> Arts </li>
<li> Commerce </li>
<li> Science </li>
</ol>
</body>
Start Attribute:
We can change the starting value of the numbering scheme by making use of attribute of the <ol>
Value Attribute: It can be used with <li> to set different values for individual list items. In the below examples value=4 indicates alphabets D and value=10 indicates alphabet J.
e.g. <body>
<ol type=A>
<li> Arts </li>
<li value=4> Commerce </li>
<li value=10> Science </li>
</ol>
</body>
Q. Display the following Nested list background of a web a page should be texture bmp and overall text, color should be orange. Basics of HTML should be the heading which is controlly placed on the page.
*Basics of HTML
1. Tags- Navy Color
Document Structure Tag Formatting text
i. <b> i. <html>
ii. <i> ii. <head>
iii. <s> iii. <body>
2. Events:
Mouse Events
1. onMouseClick
2. onMouseMove
3. onMouseUp
Keyboard Events
1. onKeyDown
2. onKeyPress
Solution:
1. onKeyDown
2. onKeyPress
Solution:
<html>
<head>
<title> Nested list example </title>
</head>
<h1> <center><font color=black> Basic of HTML
</font></center></h1>
<ol>
<font size=5 color=blue>
<li> Tags </li> </font>
<font size=4>
<ul type=square>
<li> Document Structure Tags </li>
<ol type=i>
<li>html</li>
<li>head</li>
<li>body</li>
</ol>
<li> Formatting Tags</li>
<ol type=1>
<li>b</li>
<li>i</li>
<li>s</li>
</ol>
</ul>
</font>
<font size=5 color=blue>
<li> Events </li> </font>
<font size=4>
<ul type=square>
<li> Mouse Events </li>
<ol type=i>
<li>on Mouse Click</li>
<li>on Mouse Move</li>
<li>on Mouse Up</li>
</ol>
<li> Keyboard Events</li>
<ol type=1>
<li>on KeyDown</li>
<li>on KeyPress</li>
</ol>
</ul>
</font>
</ol>
</body>
</html>
0 Comments