检查代码，看看是否有错误

来源：2-7 编程练习

weixin_慕的地5241954

2019-08-16 23:43:53

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">  
    <title>CSS布局</title>
    <style type="text/css">
/*此处写代码*/
    *{
margin: 0;
padding: 0;
}
.content{
width: 760px;
margin: 0 auto;
font-family: Serif;/*有衬字体*/
}
.content h2{
text-align: center;
margin-top: 50px;
}
.content dl .con-top{
float: left;
width: 50%;
}
.content dl .con-top img{
width: 360px;
height: 200px;
}
.content dl .con-bottom{
float: left;
width: 50%;
font-size: 14px;
font-weight: bold;
text-align: left;
}
.content dl .clear{
clear: both;
} /*--清除dt和dd的浮动，把父元素dl的高度撑开，在审查工具中可以看见，非常重要的细节，方便对dl整体排版*/
.content dl{
margin-left: 45px;
width: 760px;
margin-top: 10px;
}
    </style>
</head>
<body>
<!-- 此处写代码 -->
<div class="content">
<h2>ENJOY THE LIFE</h2>
<dl>
<dt class="con-top"><img src="http://climg.mukewang.com/58f829090001a4b504260240.jpg"/></dt>
<dt class="con-top"><img src="http://climg.mukewang.com/58f8290f0001558804260240.jpg"/></dt><!--dt可以排在一起，注意常规流顺序-->
<dd class="con-bottom">
Life is like a book,just read more and more refined,more write more carefully.
When read,mind open,all things have been indiferent to heart.Life is the precipitation.
</dd>
<dd class="con-bottom">
Life is like a book,just read more and more refined,more write more carefully.
When read,mind open,all things have been indiferent to heart.Life is the precipitation.
</dd>
<div class="clear"></div><!--清除dt和dd的浮动，把父元素dl的高度撑开，在审查工具中可以看见，非常重要的细节，方便对dl整体排版-->
</dl>
</div>
</body>
</html>

写回答

2回答