排行榜样式

1：效果



2：资源
dotted.gif


theme_ui.png



3：div

<div class="toplist">
<ul>
<li>
<var>1</var><a href="http://news.qq.com/a/20120402/000470.htm" target="_blank">高清：路透社三月图片精选</a>
</li>
<li>
<var>2</var><a href="http://news.qq.com/a/20120403/000373.htm" target="_blank">高清：北京兰博基尼违章被交警摘牌</a>
</li>
<li>
<var>3</var><a href="http://news.qq.com/a/20120401/000235.htm" target="_blank">图片故事：12岁女孩苦撑一个家</a>
</li>
<li>
<var>4</var><a href="http://news.qq.com/a/20120330/001752.htm" target="_blank">高清：留守妈妈因养孩子太累 带三个宝宝自杀</a>
</li>
<li>
<var>5</var><a href="http://news.qq.com/a/20120330/000246.htm" target="_blank">组图：网络视频曝90后少年暴打老人</a>
</li>
<li>
<var>6</var><a href="http://news.qq.com/a/20120401/000674.htm" target="_blank">湖南邵东发生枪杀命案 警方调集100多警力缉凶</a>
</li>
<li>
<var>7</var><a href="http://news.qq.com/a/20120331/000585.htm" target="_blank">湖南矮寨特大悬索桥通车 创4项世界第一</a>
</li>
<li>
<var>8</var><a href="http://news.qq.com/a/20120330/001052.htm" target="_blank">高清：腾讯网一周图片精选(2012.3.24-3.30)</a>
</li>
<li>
<var>9</var><a href="http://news.qq.com/a/20120330/000424.htm" target="_blank">全球身材最好的20位女人 中国无人上榜</a>
</li>
<li>
<var>10</var><a href="http://news.qq.com/a/20120402/000209.htm" target="_blank">高清：陈光标穿雷锋装呼吁网友献血种树</a>
</li>
</ul>
</div>

4:css

body {
	margin:0;
	padding:0;
	line-height:1.75;
	font-size:12px;
	font-family:"宋体", sans-serif;
}
a:link, a:visited {
	color:#333;
	text-decoration:none
}
a:hover, a:active {
	text-decoration:underline
}
.toplist ul {
	padding: 0 10px;
	width:287px;
	height:481px;
	overflow: hidden;
}
.toplist li {
	list-style:none;
	background:url(dotted.gif) repeat-x left bottom;
	height:32px;
	line-height:32px;
	width:100%;
	float: left;
	padding-bottom:1px;
}
.toplist li var {
	background-image:url(theme_ui.png);
	background-repeat: no-repeat;
	font-style:normal;
	font-weight:normal;
	width:14px;
	height:14px;
	line-height:14px;
	text-align:center;
	font-weight:700;
	color:#000;
	display:inline;
	float: left;
	background-position: -566px -179px;
	display:inline;
	margin: 0 10px 0 2px;
	margin-top:10px;
*margin-top:8px;
}