3-2编程
来源：3-1 实战分析
qq_木鱼_14
2017-10-18 14:36:31
这那里还要改的
<!DOCTYPE html>
<html>
<head>
<!-- 此处编写样式 -->
<mate charset="utf-8">
<title>float</title>
<style type="text/css">
*{padding:0;
margin:0;
font-size:16px;
font-style:"微软雅黑";
}
.content{width:800Px;
height:450px;
border:1px dashed #ccc;
float:left;
}
.img1,.img2,.img3,.img4,.img5,.img6{width:240px;
height:200px;border:1px solid #ccc;margin:10px;
float:left;
}
P{width:100%;
height:20px;
text-align:center;
line-height:30px;
padding:5px;
}
</style>
</head>
<body>
<!-- 此处写代码 -->
<div class="content">
<div class="img1">
<img src="http://climg.mukewang.com/590fe9770001e63102400135.jpg"alt="picture1">
<P>欢迎来到慕课网学习新知识</P>
</div>
<div class="img2">
<img src="http://climg.mukewang.com/590fe97d00011bda02400135.jpg"alt="picture2">
<P>欢迎来到慕课网学习新知识</P>
</div>
<div class= "img3">
<img src="http://climg.mukewang.com/590fe982000150ba02400135.jpg"alt="picture3">
<p>欢迎来到慕课网学习新知识</p>
</div>
<div class="img4">
<img src="http://climg.mukewang.com/590fe9770001e63102400135.jpg"alt="picture4">
<P>欢迎来到慕课网学习新知识</P>
</div>
<div class="img5">
<img src="http://climg.mukewang.com/590fe97d00011bda02400135.jpg"alt="picture5">
<P>欢迎来到慕课网学习新知识</P>
</div>
<div class= "img6">
<img src="http://climg.mukewang.com/590fe982000150ba02400135.jpg"alt="picture6">
<p>欢迎来到慕课网学习新知识</p>
</div>
</div>
</body>
</html>
1回答
-
好帮手慕糖
2017-10-18
你好，1、p标签，已经样式中的p选择器、各个px单位中的p使用的是大写哟，虽说也可以识别，不过建议：统一使用小写哟。
2、整体大盒子的宽度可以在调整下哟，一个小盒子的宽度是262px（包括左右外边距与左右边框），一行三个，那么就是262*3 = 786；那么大盒子的宽度设置786px就可以了哟。
祝学习愉快~
0
相似问题