日期:2014-05-17  浏览次数:20618 次

dl和ul在同一样显示,上下为什么不能对齐?
<style>
dl{clear:left;}
dt,dd{float:left}
li {
display: inline;
padding: 10px;
background-color: #efffef;
}

dt {
padding: 10px;
background-color: #efffef;
}
</style>



 <dl>
<dt><strong>数量</strong></dt>
<dd>
<ul><li>一百</li>
<li>一千</li>
<li>一万</li>
</ul>

------解决方案--------------------

<style type="text/css">
dl,ul{float:left;margin:0;padding:0;width:100%;height:100%}
dl{background-color:#f00;}
dt,dd{float:left;margin:0;height:100%}
dt {background-color: #efffef;padding: 10px;}
dd{background-color:green}
ul{background-color:#ddd;}
li {
float:left;
display: block;
padding:10px;
background-color: #efffef;
width:auto;
height:100%;
}


</style>
</head>

<body>
<dl>
<dt><strong>数量</strong></dt>
<dd>
<ul>
<li>一百</li>
<li>一千</li>
<li>一万</li>
</ul> 
</dd>
</dl>
</body>
</html>