该inline-block价值
它有可能很长一段时间来创建一个框的网格,填补了浏览器的宽度,并很好地包裹(当浏览器大小),通过使用float
属性。
然而, inline-block
的值display
属性使这个更容易。
inline-block元素像内联元素,但他们可以有宽度和高度。
例子
老方法-用float
(请注意,我们还需要指定一个clear
浮箱后元素属性):
例
.floating-box {
float: left;
width: 150px;
height: 75px;
margin: 10px;
border: 3px solid #73AD21;
}
.after-box {
clear: left;
}
试一试» 同样的效果可以通过使用可以实现inline-block
的值display
属性(注意没有clear
需要属性):
例
.floating-box {
display: inline-block;
width: 150px;
height: 75px;
margin: 10px;
border: 3px solid #73AD21;
}
试一试»