Correction status:Uncorrected
Teacher's comments:
层叠样式:内联>内部>外部
常用CSS选择器:块:div p ul li 行内:b del 行内块:img input
元素内外框:marring-right..... padding-right......
浮动:float
<!DOCTYPE html> <html> <head> <title>优酷-这世界很酷</title> <link rel="icon" type="image/x-icon" href="static/images/1.ico"> <style type="text/css"> *{margin: 0;padding: 0;} li{list-style: none; float: left;} a{color: #000;text-decoration: none;} .clear{clear: both;} .mr{margin-right: 10px;} .l{float: left;} .contents{ width: 1540px; margin: 0 auto; } .content{ width: 100%; margin-top: 20px; } .contentul{line-height: 70px;} small{color: #ccc;} .hot-tv img{ width: 210px; height: 320px; } .tab li{margin-left: 25px;} .bigshow img{ width: 420px; height: 320px; } .tv-tab img{ width: 210px; height: 120px; } .tv-tab{ width: 1100px } .tv-tab li{margin:0 4px 20px;} </style> </head> <body> <div class="contents"> <div class="content"> <div class="contentul"> <h2>正在热播</h2> </div> <ul class="hot-tv"> <li > <a href=""> <img src="static/images\a.jpg"><br> <span>雪地娘子军</span> </a><br> <small>邱胜翊王笛演革命虐恋</small> </li> <li class="mr"> <a href=""> <img src="static/images/b.jpg"><br> <span>雪地娘子军</span> </a><br> <small>邱胜翊王笛演革命虐恋</small> </li> <li class="mr"> <a href=""> <img src="static/images/c.jpg"><br> <span>雪地娘子军</span> </a><br> <small>邱胜翊王笛演革命虐恋</small> </li> <li class="mr"> <a href=""> <img src="static/images/d.jpg"><br> <span>雪地娘子军</span> </a><br> <small>邱胜翊王笛演革命虐恋</small> </li> <li class="mr"> <a href=""> <img src="static/images/e.jpg"><br> <span>雪地娘子军</span> </a><br> <small>邱胜翊王笛演革命虐恋</small> </li> <li class="mr"> <a href=""> <img src="static/images/f.jpg"><br> <span>雪地娘子军</span> </a><br> <small>邱胜翊王笛演革命虐恋</small> </li> <li class="mr"> <a href=""> <img src="static/images/g.jpg"><br> <span>雪地娘子军</span> </a><br> <small>邱胜翊王笛演革命虐恋</small> </li> </ul> <div class="clear"></div> </div> <div class="content"> <h2 class="l">剧集 ></h2> <ul class="tab"> <li class="l" style="margin-top: 5px; "><a href="">最新</a></LI> <li class="l" style="margin-top: 5px; "><a href="">大陆剧</a></LI> <li class="l" style="margin-top: 5px; "><a href="">台剧</a></LI> <li class="l" style="margin-top: 5px; "><a href="">日剧</a></LI> </ul> <div class="clear"></div> <div class="tv_show"> <div class="bigshow l "> <a href=""> <img src="static/images/tv.jpg"> <br> <span>娘子军</span> </a><br> <small>邱胜翊王笛演革命虐恋</small> </div> <ul class="tv-tab l"> <li> <a href=""> <img src="static/images/tv1.jpg"><br> <span>娘子军</span> </a><br> <small>邱胜翊王笛演革命虐恋</small> </li> <li> <a href=""> <img src="static/images/tv2.jpg"><br> <span>娘子军</span> </a><br> <small>邱胜翊王笛演革命虐恋</small> </li> <li> <a href=""> <img src="static/images/tv3.jpg"><br> <span>娘子军</span> </a><br> <small>邱胜翊王笛演革命虐恋</small> </li> <li> <a href=""> <img src="static/images/tv4.jpg"><br> <span>娘子军</span> </a><br> <small>邱胜翊王笛演革命虐恋</small> </li> <li> <a href=""> <img src="static/images/tv5.jpg"><br> <span>娘子军</span> </a><br> <small>邱胜翊王笛演革命虐恋</small> </li> <li> <a href=""> <img src="static/images/tv1.jpg"><br> <span>娘子军</span> </a><br> <small>邱胜翊王笛演革命虐恋</small> </li> <li> <a href=""> <img src="static/images/tv2.jpg"><br> <span>娘子军</span> </a><br> <small>邱胜翊王笛演革命虐恋</small> </li> <li> <a href=""> <img src="static/images/tv3.jpg"><br> <span>娘子军</span> </a><br> <small>邱胜翊王笛演革命虐恋</small> </li> <li> <a href=""> <img src="static/images/tv4.jpg"><br> <span>娘子军</span> </a><br> <small>邱胜翊王笛演革命虐恋</small> </li> <li> <a href=""> <img src="static/images/tv5.jpg"><br> <span>娘子军</span> </a><br> <small>邱胜翊王笛演革命虐恋</small> </li> </ul> </div> </div> </div> </body> </html>
点击 "运行实例" 按钮查看在线实例