Html-Learning-Code/html list.html at master · iiamvk/Html-Learning-Code · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="utf-8">
<title> ODER,UNODER and descriptive </title>
<style type="text/css">
ol{
color:red;
font-style:bold;
font-family:times;
}
h1{
color:violet;
font-family:times;
text-align:center;
font-style:italic;
}
#d1{
color:rgb(0,255,257);
}
#d2{
color:#f09;
font-size:20px;
}
#d3{
background-color:silver;
}


ul{
list-style-type:square;
color:gray;
font-style:italic;
font-size:28px;
}
.c1{
color:lightblue;
}
.c2{
padding:10px;
margin:0px;
color:orange;
}
.c3{
text-align:center;
}

dl{
font-family:times;
}

#t1{
background-color:red;
width:60px;
}
.d1{
color:white;
}
#t2{
padding:5px;
margin:0px;
color:darkgreen;
}
.d2{
color:brown;
}
body{
}

</style>
</head>
<body>
<h1> favourite subject order list</h1>
<!--the type of ol tag is only define by html not a css it's value type=1,a,A,i,I -->
<ol type="i"  >
<li id="d1"> PHYSICS </li>
<li id="d2"> CHEMISTRY </li>
<li id="d3"> MATHS </li>
</ol>
<h1> favourite fruit unorder list </h1>
<!-- ul tag is under line tag you can
style your list-style-type:circle,disc,
square,none etc.-->
<ul>
<li class="c1"> apple </li>
<li class="c2"> graps </li>
<li class="c3"> pine apple</li>
</ul>
<h1> description list </h1>
<!-- dl=description list and dt=description name
and dd=define description -->
<dl>
<dt id="t1"> html5 </dt>
<dd class="d1"> html5 is a fifth version of
html language it is decleared in octubor 2014 </dd>
<dt id="t2"> css3 </dt>
<dd class="d2"> csss3 is a third version of
cascading stye sheet (css3)</dd>
</dl>
</body>
</html>