<!DOCTYPE?HTML>
<html>
<head>
<meta?http-equiv="Content-Type"?content="text/html;?charset=utf-8">
<title>?p標(biāo)簽</title>
<style>
????*{padding:0px;margin:0px;}
????img{width:80px;}
????body{font-size:14px;}
????.color-b{color:blue;}
????.top{border:1px?solid?gray;}
????.top-title{text-indent:1em;background-color:yellow;}
????.top-content{background-color:rgb(181,?177,?61);?padding:?5px?0px;}
????.top-content?.top-item{?border-bottom:1px?gray?dashed;line-height:1.5em;?margin:?3px?30px;clear:both;}
????.top-content?.active{background-color:white;?padding:10px?0px;height:6em;}
????.top-content?.top-item?div{float:left;}
????.top-content?.top-item?dl{margin-left:5px;float:left;}
????.top-content?.top-item?dl?dd{margin-top:10px;}
????.top-content?.top-item?dl?dd?p{overflow:hidden;width:150px;white-space:nowrap;text-overflow:ellipsis;}
</style>
</head>
<body>
????<div?class="top">
????<h3?class="top-title">新書熱賣</h3>
????<ol?class="top-content">
????????<li?class="top-item?active"?type="1">
????????????<div>
????????????????<img?src="http://f.hiphotos.baidu.com/image/h%3D200/sign=d9c2d17b1a950a7b6a3549c43ad0625c/14ce36d3d539b600af3985faee50352ac75cb78c.jpg"/>????
????????????</div>
????????????<dl>
????????????????<dt?class="color-b">不省心（馮小剛）</dt>
????????????????<dd>
????????????????????<p>作者：馮小剛</p>
????????????????????<p>出版社：長江文藝出版社</p>
????????????????????<p>出版時間：2013年09月</p>
????????????????</dd>
????????????</dl>
????????</li>
????????<li?class="top-item?color-b">我承認(rèn)我不曾歷經(jīng)滄桑</li>
????????<li?class="top-item?color-b">不為遇見，只為遠(yuǎn)方</li>
????????<li?class="top-item?color-b">站在兩個世界的邊緣</li>
????</ol>
????</div>
????<ol>
????????<li>我的第一個列表信息。</li>
????</ol>
????<script>
????????//?這個是張大大的關(guān)于ol的博客，搜藏一下
????????//?http://www.zhangxinxu.com/wordpress/2009/12/html-css列表元素uloldl的研究與應(yīng)用/
????</script>
</body>
</html>這是代碼，實(shí)在整不動了，這是要達(dá)到的效果；通過ol的有序，然后給ol的序號設(shè)置樣式，上面ol中l(wèi)i序號放到里面是：list-style-position: inside，不過這樣第一行就亂套了；求解答
2 回答
- 2 回答
- 2 關(guān)注
- 2777 瀏覽
添加回答
舉報
0/150
提交
取消