為什么我的dl全部都換行了
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
body{
padding: 0;
font-size: 10pt;
}
.topmenu{
display: block;
width: 200px;
border: 2px solid #e4393c;
margin: 0;
padding: 0;
list-style: none;
}
.toptitle{
padding-left: 20px;
height: 40px;
background: #e4393c;
color: #fff;
line-height: 40px;
font-size: 14px;
font-weight: bold;
}
.topmenu{
? ?background-color: #eee;
}
.topmenu li{
display: block;
line-height: 30px;
height: 30px;
font-size: 11pt;
text-align: left;
padding-left: 8px;
z-index: 3;
}
.topmenu li:hover{
background: #fff;
border: 1px solid #DDD;
border-right: none;
box-shadow: 0 0 8px #DDD;
-moz-box-shadow:0 0 8px #DDD;
-webkit-box-shadow:0 0 8px #DDD;
}
.topmenu li a{
text-decoration: none;
color: #313131;
background-image: url();
}
.topmenu li a:hover{
? ? ? ? ? ? ? background: #fff;
? ? ? ? ? ? ? color: red;
? ? ? ? ? ? ? text-decoration: underline;
? ? ? ? ? ? ? font-weight: bold;
}
.submenu{
display: block;
? ? ? ? ? ? width: 715px;
? ? ? ? ? ? left: 208px;
? ? ? ? ? ? position: absolute;
? ? ? ? ? ? top: 45px;
? ? ? ? ? ? border: 1px solid #DDD;
? ? ? ? ? ? z-index: 4;
? ? ? ? ? ? background: white;
? ? ? ? ? ? box-shadow: 0 0 8px #DDD;
? ? ? ? ? ? -moz-box-shadow: 0 0 8px #DDD;
? ? ? ? ? ? -webkit-box-shadow: 0 0 8px #DDD;
}
.lefdiv{
float: left;
width: 490px;
margin:5px;?
}
.rightdiv{
background: blue;
float: right;
width: 200px;
margin:5px;
}
.topmenu li:hover .submenu{
display: block;
}
.topmenu li:hover ?span{
background: white;
? ? ? ? ? ? display: inline-block;
? ? ? ? ? ? z-index: 20;
? ? ? ? ? ? width: 20px;
? ? ? ? ? ? height: 30px;
? ? ? ? ? ? float: right;
? ? ? ? ? ? position: relative;
}
.lefdiv dl{
display: block;
border-bottom: 1px solid #ccc;
padding-bottom: 6px;
overflow: hidden;
}
.lefdiv dl dt{
? ? display: block;
? ? ? ? ? ? ? ? float: left;
? ? ? ? ? ? ? ? width: 60px;
? ? ? ? ? ? ? ? text-align: right;
? ? ? ? ? ? ? ? height: 22px;
? ? ? ? ? ? ? ? line-height: 22px;
? ? ? ? ? ? ? ? padding-right: 6px
}
.lefdiv dl dt a{
color: #e4393c;
font-weight: bold;
text-decoration: underline;
font-size: 10pt;
}
.lefdiv dl dd{
width: 60px;
display: block;
overflow: hidden;
}
.lefdiv dl dd a{
display: block;
float: left;
border-left: ?1px solid #ccc;
color: #737373;
font-size: 9pt;
? ? ? ? ? ? ? ? ? ? ?padding: 0 8px;
? ? ? ? ? ? ? ? ? ? height: 14px;
? ? ? ? ? ? ? ? ? ? line-height: 14px;
? ? ? ? ? ? ? ? ? ? ?margin: 4px 0;
}
</style>
</head>
<body>
<ul>
? ? ? ? <div>
? ? ? ? ? ? 全部商品分類
? ? ? ? </div>
? ? ? ? <li><a href="#">圖書、音像、數(shù)字商品</a><span></span>
? ? ? ? ?<div>
? ? ? ? ?<div>
? ? ? ? ?<dl>
? ? ? ? ?<dt><a href="">電子書</a></dt>
? ? ? ? ?<dd><a href="">免費</a></dd>
? ? ? ? ?<dd><a href="">小說</a></dd>
? ? ? ? ?<dd><a href="">勵志與成功</a></dd>
? ? ? ? ?<dd><a href="">婚姻兩性</a></dd>
? ? ? ? ?<dd><a href="">文學</a></dd>
? ? ? ? ?<dd><a href="">經管</a></dd>
? ? ? ? ?</dl>
? ? ? ? ?</div>
? ? ? ? ?<div>圖片</div>
? ? ? ? ?</div>
? ? ? ? </li>
? ? ? ? <li><a href="#">家用電器</a></li>
? ? ? ? <li><a href="#">手機、數(shù)碼</a></li>
? ? ? ? <li><a href="#">電腦、辦公</a></li>
? ? ? ? <li><a href="#">家居、家具、家裝、廚具</a></li>
? ? ? ? <li><a href="#">服飾內衣、珠寶首飾</a></li>
? ? ? ? <li><a href="#">個護化妝</a></li>
? ? ? ? <li><a href="#">鞋靴、箱包、鐘表、奢侈品</a></li>
? ? ? ? <li><a href="#">運動戶外</a></li>
? ? ? ? <li><a href="#">汽車用品</a></li>
? ? ? ? <li><a href="#">母嬰、玩具樂器</a></li>
? ? ? ? <li><a href="#">食品飲料、酒類、生鮮</a></li>
? ? ? ? <li><a href="#">營養(yǎng)保健</a></li>
? ? </ul>
</body>
</html>
2015-05-22
因為它們是塊級元素
2015-05-22
你總共就一個dl，難道你有第二個嗎