該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;
}
試一試»