標籤：html css
本文出自：http://blog.csdn.net/svitter
１. 建立一個HTML頁面， 其內容為一個無序列表，列表中至少包含了5本暢銷書，每本書之前的項目符號必須採用概述封面的縮圖。這些資訊可以沖Web上擷取。 要求採用CSS方法進行布局。
交作業的請不要照抄My Code- -。
ex1.html:
<html><head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <link href="book.css" rel="stylesheet" type="text/css"></head><!--.author:svitter;--><body><div><h1 class="diffentcolor">Linux暢銷書</h1> <div id="menu"> <br /> </div> <div id="content"><ul> <li id="book1">鳥哥的Linux私房菜基礎篇</li> <li id="book2">鳥哥的Linux私房菜伺服器篇</li> <li id="book3">Linux命令列與shell指令碼編程大全</li> <li id="book4">Linux營運之道</li> <li id="book5">Linux/Unix系統編程手冊</li> </ul> </div></div></body>
.diffentcolor{color:green;}#differcolor{color:green}body, td, div, .p, a {font-family: arial,sans-serif;}h1,h2{font-family:sans-serif;color:gray;}.author{by:svitter;}h1{border-bottom:1px solid black;border-bottom:1px;solid black;}div#container{width:500p}div#menu {width:150px;float:left;}div#content {float:left;}li#book1{list-style-image:url(pic/popularBook.jpg);}li#book2{list-style-image:url(pic/popularBook2.jpg);}li#book3{list-style-image:url(pic/popularBook3.jpg);}li#book4{list-style-image:url(pic/popularBook4.jpg);}li#book5{list-style-image:url(pic/popularBook5.jpg);}
效果簡單示範：
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
