不知道什么地方出问题导致布局混乱css
<!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=utf-8" />
<title>无标题文档</title>
<style>
ul,dl,body,dd{margin 0;padding 0; font-family:"宋体"}
li{list-style:none;}
a{text-decoration:none;color:#4f6c84}
img{border:none;vertical-align:top;}
.clear{zoom:1;}
.clear:after{content""; display:block; clear:both;}
.wrap{width:445px;margin:30px auto;padding:12px 8px 0px 7px;background:url(3.jpg) no-repeat 220px 0;}
.left{width:212px; float:left;}
.lefttop .pic{width:124px; background:url(4.jpg) no-repeat right 0;padding-right:5px;float:left;}
.lefttop .pic a{border:1px solid #c3cfd9; display:block;padding:3px;}
.lefttop dl{float:left;width:60px; padding-left:5px;font-size:12px;line-height:20px;color:#7190a6}
.leftbottom{padding-top:10px;}
.leftbottom li{padding-top:10px;line-height:20px;font-size:12px;padding-left:10px; background:url(5.jpg) no-repeat 0 7px}
.right{float:right;width:220px;}
.right li{width:100px; float:left;padding-left:10px;}
.right a{display:block;}
.right img{boder:1px solid #c3cfd9;padding:3px;}
.right strong{display:block;padding-top:3px;font:normol 12px/24px "宋体";text-align:center;}
</style>
</head>
<body>
<div class="wrap clear">
<div class="left">
<div class="lefttop clear">
<div class="pic">
<a href="#">
<img src="pic.jpg"/>
</a>
</div>
<dl>
<dt>
<a href="#">潜伏</a>
</dt>
<dd>导演：姜伟</dd>
<dd>主演：姚晨 孙红雷</dd>
</dl>
</div>
<ul class="leftbottom">
<li>
<a href="#">海清张佳译演绎房奴生活《蜗居》</a>
</li>
<li>
<a href="#">琼瑶经典言情剧集锦</a>
<a href="#">梦露电影知多少</a>
</li>
</ul>
</div>
<ul class="right">
<li>
<a href="#">
<img src="2.jpg"/>
<strong>将爱情进行到底</strong>
</a>
</li>
<li>
<a href="#">
<img src="2.jpg"/>
<strong>将爱情进行到底</strong>
</a>
</li>
</ul>
</div>
</div>
</body>
</html>
1回答
-
woshiajuana
额···同学，给出你现在的效果图，在说说你想要的效果图 你这样发，还有图片，我复制下来都就是几段文字，让人无法回答起10