編程練習(xí)
小伙伴們，根據(jù)所給素材制作如下圖所示的TOP排行新聞列表。
圖片素材:
圖片引用，請使用此地址 http://img1.sycdn.imooc.com//53cf0fa20001d3dc00200032.jpg
溫馨提示:完成任務(wù)后，請驗證是否與實踐描述效果一致，如一致，恭喜您，你已經(jīng)掌握此技能，否則，請重復(fù)學(xué)習(xí)此節(jié)內(nèi)容吆。
任務(wù)
在右邊代碼編程器中9行處添加以下CSS樣式:
一、定義topList類選擇器，設(shè)置其寬為300px，高為180px，邊框線為1px實線 顏色為#E8E8E8，并讓其在頁面中水平居中。
二、去除項目列表項的項目符號，并設(shè)置整個列表ul四個方向填充均為5px。
三、設(shè)置em標(biāo)簽樣式為寬20px，高16px，水平居中，不傾斜，顏色為#333，并設(shè)置背景圖片。
四、單獨設(shè)置.top中的em標(biāo)簽的背景圖片。
五、控制超鏈接的四種狀態(tài)。
提示:
background-position的詳細用法參考http://idcbgp.cn/wenda/detail/12584
注意：
1.em為內(nèi)聯(lián)元素，要把他改為塊級元素后，設(shè)置的寬度和高度才有效
2.所有em的背景圖片均為num.gif，通過設(shè)置background-position屬性來控制不同列表項顯示不同的背景圖片
- ?不會了怎么辦
-
小伙伴們，可以在右下角的"源代碼下載"區(qū)，下載參考代碼。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>3.10新聞中心制作評測題</title>
<style type="text/css">
/*在此定義相關(guān)CSS樣式*/
</style>
</head>
<body>
<div class="topList">
<ul>
<li class="top"><em>01</em>
<p><a href="http://idcbgp.cn/" >【慕客訪談用戶篇】“有為屌絲”在路上</a></p>
</li>
<li class="top"><em>02</em>
<p><a href="http://idcbgp.cn/">【有獎活動】給父親的三行書信</a></p>
</li>
<li class="top"><em>03</em>
<p><a href="http://idcbgp.cn/">《程序猿，請曬出你的童年》活動獲獎公告</a></p>
</li>
<li><em>04</em>
<p><a href="http://idcbgp.cn/">【慕課訪談】破繭成蝶——美女程序員的蛻變史</a></p>
</li>
<li><em>05</em>
<p><a href="http://idcbgp.cn/">【獲獎公告】追“球”巔峰，爭當(dāng)“預(yù)言帝”</a></p>
</li>
<li><em>06</em>
<p><a href="http://idcbgp.cn/">【問卷調(diào)查】慕課網(wǎng)用戶學(xué)習(xí)情況大調(diào)查</a></p>
</li>
</ul>
</div>
</body>
請驗證，完成請求
由于請求次數(shù)過多，請先驗證，完成再次請求
