css浮动4-11编程
来源：4-11 编程练习
qq_精慕门6417434
2021-02-21 14:12:04
相关代码：
<!DOCTYPE html>
<html>
<head>
<!-- 此处编写样式 -->
<style>
#p1{
/*float:left;*/
}
#div1{
float:left;
border-bottom:solid #d0d0d0 0.5px;
border-left:solid #d0d0d0 0.5px;
border-right:solid #d0d0d0 0.5px;
margin-right:5px;
margin-left:5px;
margin-top:10px;
}
#p{
line-height:0px;
padding-left:5px;
}
img{
vertical-align:bottom;
}
</style>
</head>
<body>
<!-- 此处写代码 -->
<div id="div1">
<img id="p1" src="http://climg.mukewang.com/590fe9770001e63102400135.jpg" />
<div id = "p">
<p>欢迎来到慕课网学习新知识！</p>
</div>
</div>
<div id="div1">
<img id="p1" src="http://climg.mukewang.com/590fe97d00011bda02400135.jpg" />
<div id = "p">
<p>欢迎来到慕课网学习新知识！</p>
</div>
</div>
<div id="div1">
<img id="p1" src="http://climg.mukewang.com/590fe982000150ba02400135.jpg" />
<div id = "p">
<p>欢迎来到慕课网学习新知识！</p>
</div>
</div>
<div id="div1">
<img id="p1" src="http://climg.mukewang.com/590fe9770001e63102400135.jpg" />
<div id = "p">
<p>欢迎来到慕课网学习新知识！</p>
</div>
</div>
<div id="div1">
<img id="p1" src="http://climg.mukewang.com/590fe97d00011bda02400135.jpg" />
<div id = "p">
<p>欢迎来到慕课网学习新知识！</p>
</div>
</div>
<div id="div1">
<img id="p1" src="http://climg.mukewang.com/590fe982000150ba02400135.jpg" />
<div id = "p">
<p>欢迎来到慕课网学习新知识！</p>
</div>
</div>
</body>
</html>
写回答
1回答
-
好帮手慕小班
2021-02-21
同学你好，测试贴出代码，并没有出现三行两列的效果，例如
建议同学在所有div外设置一个总的div并设置宽度，比如
效果
祝学习愉快！
0
相似问题