3-4编程的练习
来源:3-4 编程练习
myhohner
2018-07-14 14:17:09
<!DOCTYPE html>
<html>
<head>
<!-- 此处编写样式 -->
<style type="text/css">
*{
margin: 0;padding: 0
}
.continer{
width: 820px;
overflow: hidden;margin: 0px auto
}
.continer div{
width: 240px;
border: solid gray thin;
}
.block1,.block2,.block3,.block4,.block5,.block6{
float: left;margin: 11.5px;
}
.block4,.block1{
margin-left: 23px;
clear: both
}
</style>
</head>
<body>
<!-- 此处写代码 -->
<div class="continer">
<div class="block1">
<img src="http://climg.mukewang.com/590fe9770001e63102400135.jpg">
<span>欢迎来到慕课网学习新知识!</span>
</div>
<div class="block2">
<img src="http://climg.mukewang.com/590fe97d00011bda02400135.jpg">
<span>欢迎来到慕课网学习新知识!</span>
</div>
<div class="block3">
<img src="http://climg.mukewang.com/590fe982000150ba02400135.jpg">
<span>欢迎来到慕课网学习新知识!</span>
</div>
<div class="block4">
<img src="http://climg.mukewang.com/590fe9770001e63102400135.jpg">
<span>欢迎来到慕课网学习新知识!</span>
</div>
<div class="block5">
<img src="http://climg.mukewang.com/590fe97d00011bda02400135.jpg">
<span>欢迎来到慕课网学习新知识!</span>
</div>
<div class="block6">
<img src="http://climg.mukewang.com/590fe982000150ba02400135.jpg">
<span>欢迎来到慕课网学习新知识!</span>
</div>
</div>
</body>
</html>
老师,为何span文字与图片之间会留有一段空隙?始终找不出原因
1回答
同学是指红框处的白边么?建议同学加上下边的代码试试。图片有一个默认的边距,加上display:block;可以去掉白边。
img{
display:block;
}
如果我的回答解决了你的问题,请采纳,祝学习愉快.
相似问题