老师您好，为什么我这样写没有用到清除浮动的操作，还有为什么不能居中
来源：3-4 编程练习
两颗葱厶
2018-10-18 17:49:21
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>浮动编程练习</title>
<style type="text/css">
body{
margin: 0px auto;
padding:0px;
text-align: center;
}
.框架{
width: 790px;
height:430px;
border: 1px lightblue dashed;
}
.框1{
margin: 10px;
float: left;
border: 1px black solid;
}
.框2{
margin: 10px;
float: left;
border: 1px black solid;
}
.框3{
margin: 10px;
float: left;
border: 1px black solid;
}
.框4{
margin: 10px;
float: left;
border: 1px black solid;
}
.框5{
margin: 10px;
float: left;
border: 1px black solid;
}
.框6{
margin: 10px;
float: left;
border: 1px black solid;
}
p{
text-align: center;
}
</style>
</head>
<body>
<div class="框架">
<div class="框1">
<div class="图1">
<img src="http://climg.mukewang.com/590fe9770001e63102400135.jpg">
<p>欢迎来到慕课网学习新知识</p>
</div>
</div>
<div class="框2">
<div class="图2">
<img src="http://climg.mukewang.com/590fe97d00011bda02400135.jpg">
<p>欢迎来到慕课网学习新知识</p>
</div>
</div>
<div class="框3">
<div class="图3">
<img src="http://climg.mukewang.com/590fe982000150ba02400135.jpg">
<p>欢迎来到慕课网学习新知识</p>
</div>
</div>
<div class="框4">
<div class="图4">
<img src="http://climg.mukewang.com/590fe9770001e63102400135.jpg">
<p>欢迎来到慕课网学习新知识</p>
</div>
</div>
<div class="框5">
<div class="图5">
<img src="http://climg.mukewang.com/590fe97d00011bda02400135.jpg">
<p>欢迎来到慕课网学习新知识</p>
</div>
</div>
<div class="框6">
<div class="图6">
<img src="http://climg.mukewang.com/590fe982000150ba02400135.jpg">
<p>欢迎来到慕课网学习新知识</p>
</div>
</div>
</div>
</body>
</html>
1回答
-
您好，1.如果将框架的宽度设置的大一些，会发现后面的框会浮动上去，现在是因为设置的宽度只能放三个框，所以后面的框都在下层，因此没有用到清除浮动。2.将对body标签的居中设置放入到框架中，设置框架的div可以实现居中。3.class值不建议使用中文。祝学习愉快！
0
相似问题