Create, test and validate a CSS document to describe an order list of your five favorite movies.
<!DOCTYPE html>
<html>
<head>
<title>movies</title>
<style type="text/css">
p.under{text-decoration:underline;font-size:25pt}
ol{list-style-type:upper-roman;font-family:forte;font-size:15pt}
ol ol{list-style-type:upper-alpha;font-family:forte;font-size:15pt}
ol ol ol{list-style-type:decimal;font-family:forte;font-size:15pt}
img{float:right}
</style>
</head>
<body>
<h3 align="center"><p class="under">FAVOURATE MOVIES</p></h3>
<img src="C:\Users\HOME\Pictures\wlpprzz\ff.jpg" height="25%" width="25%" alt="hollywood pic"/>
<ol>
<li><strong><p class="under">HOLLYWOOD</p></strong></li>
<ol>
<li>Hollywood Movies</li>
<ol>
<li>Death Race</li>
<li>Drag me to hell</li>
<li>Kung fu panda</li>
<li>Terminator</li>
<li>Twilight</li>
</ol>
</ol>
<li><strong><p class="under">BOLLYWOOD</p></strong></li>
<img src="C:\Users\HOME\Pictures\wlpprzz\kya.jpg" highet="25%" width="25%" alt="bollywood pic"/>
<ol>
<li>Bollywood Movies</li>
<ol>
<li>Dilwale Dulhaniya le Jayenge</li>
<li>Dil to Pagal Hai</li>
<li>Kuch Kuch Hota Hai</li>
<li>Hum Aapke Hai Kaun</li>
<li>3-Idiots</li>
</ol>
</ol>
</body>
</html>
Output:
<!DOCTYPE html>
<html>
<head>
<title>movies</title>
<style type="text/css">
p.under{text-decoration:underline;font-size:25pt}
ol{list-style-type:upper-roman;font-family:forte;font-size:15pt}
ol ol{list-style-type:upper-alpha;font-family:forte;font-size:15pt}
ol ol ol{list-style-type:decimal;font-family:forte;font-size:15pt}
img{float:right}
</style>
</head>
<body>
<h3 align="center"><p class="under">FAVOURATE MOVIES</p></h3>
<img src="C:\Users\HOME\Pictures\wlpprzz\ff.jpg" height="25%" width="25%" alt="hollywood pic"/>
<ol>
<li><strong><p class="under">HOLLYWOOD</p></strong></li>
<ol>
<li>Hollywood Movies</li>
<ol>
<li>Death Race</li>
<li>Drag me to hell</li>
<li>Kung fu panda</li>
<li>Terminator</li>
<li>Twilight</li>
</ol>
</ol>
<li><strong><p class="under">BOLLYWOOD</p></strong></li>
<img src="C:\Users\HOME\Pictures\wlpprzz\kya.jpg" highet="25%" width="25%" alt="bollywood pic"/>
<ol>
<li>Bollywood Movies</li>
<ol>
<li>Dilwale Dulhaniya le Jayenge</li>
<li>Dil to Pagal Hai</li>
<li>Kuch Kuch Hota Hai</li>
<li>Hum Aapke Hai Kaun</li>
<li>3-Idiots</li>
</ol>
</ol>
</body>
</html>
Output:
No comments:
Write comments