3-2编程练习中的小问题
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>3-2 编程练习</title>
<style type="text/css">
*{
margin: 0px;
padding: 0px;
}
.head{
border: 1px dashed lightgray;
padding: 10px;
width: 784px;
height: auto;
float: left;
}
.tupian1{
width: 240px;
height: 135px;
background-image: url(http://img1.sycdn.imooc.com/climg//590fe9770001e63102400135.jpg);
background-repeat: no-repeat;
}
.tupian2{
width: 240px;
height: 135px;
background-image: url(http://img1.sycdn.imooc.com/climg//590fe97d00011bda02400135.jpg);
background-repeat: no-repeat;
}
.tupian3{
width: 240px;
height: 135px;
background-image: url(http://img1.sycdn.imooc.com/climg//590fe982000150ba02400135.jpg);
background-repeat: no-repeat;
}
.word{
border: 1px solid lightgray;
width: 238px;
height: 29px;
line-height: 30px;
text-align: center;
}
.box{
margin: 10px;
float: left;
}
</style>
</head>
<body>
<div class="head">
<div class="box">
<div class="tupian1"></div>
<div class="word">欢迎来到慕课网学习新知识！</div>
</div>
<div class="box">
<div class="tupian2"></div>
<div class="word">欢迎来到慕课网学习新知识！</div>
</div>
<div class="box">
<div class="tupian3"></div>
<div class="word">欢迎来到慕课网学习新知识！</div>
</div>
<div class="box">
<div class="tupian1"></div>
<div class="word">欢迎来到慕课网学习新知识！</div>
</div>
<div class="box">
<div class="tupian2"></div>
<div class="word">欢迎来到慕课网学习新知识！</div>
</div>
<div class="box">
<div class="tupian3"></div>
<div class="word">欢迎来到慕课网学习新知识！</div>
</div>
</div>
</body>
</html>
助教，不好意思，我是在 sublime 里面写的代码，换到网页上Tab键全部无法识别。所以代码就只能这样粘贴上来了。
有两个小问题：
1、在相邻的div中设置 margin 的话，两div块的实际 margin 应该是两者的最大值。但是在两个div中添加 float 属性的话，margin 是叠加的效果？
2、我看了其他同学和我自己的代码，我发现大家在文字部分的 border 属性普遍都设置为 border：1px XXX XXX; 但是图片中的 border 属性应当为：border： 0px 1px 1px 1px； 不过这样设置就无法显示边框。这又是问什么呢？
正在回答
你好，1、外边距的重叠只产生在普通流文档的上下外边距之间，这里是有浮动的，不属于普通流文档的哦。
2、border 简写属性在一个声明设置所有的边框属性。可以按顺序设置如下属性：
border-width // 边宽 border-style // 样式 border-color // 颜色
border 是这三个属性的简写，如你写的border： 0px 1px 1px 1px；这个是只要边宽，没有样式与颜色，就不显示呀，如果想写上鞋左右的，建议：可以分开来写哦。
祝学习愉快~
相似问题
登录后可查看更多问答，登录/注册
- 参与学习 人
- 提交作业 11218 份
- 解答问题 36713 个
从一个不会编程的小白到一个老司机是需要过程的，首先得入门，学习基础知识，然后才能进阶，最后再到精通，本专题是你走进前端世界的不二选择！
了解课程
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星