内联块状元素(inline-block)就是同时具备内联元素、块状元素的特点,代码display:inline-block
就是将元素设置为内联块状元素。(css2.1新增),<img>、<input>标签就是这种内联块状标签。
inline-block 元素特点:
-
和其他元素都在一行上;
-
元素的高度、宽度、行高以及顶和底边距都可设置。
为a元素设置宽和高
a在默认的时候是内联元素,内联元素是不可以设置宽和高的。所以我们要把a变为内联块状元素,这样就能设置宽高了。
如:
<style type="text/css">
a{
display:inline-block;
/*这样之后宽高样式就能应用了*/
width:20px;
height:20px;
}
</style>
(写在最后)
打卡第11天啦