CSS Display(显示)
CSS Display(显示)
概述
CSS(层叠样式表)中的display
属性是控制元素如何显示的关键属性。它决定了元素的盒模型类型,即元素是块级元素、内联元素还是其他类型的元素。display
属性对于网页布局和元素样式的控制至关重要。
基本用法
块级元素
块级元素(如<div>
、<p>
、<h1>
等)通常独占一行,可以设置宽度和高度。将display
属性设置为block
,可以使元素表现为块级元素。
.element {display: block;
}
内联元素
内联元素(如<span>
、<a>
等)不会独占一行,宽度由内容决定,不能设置宽度和高度。将display
属性设置为inline
,可以使元素表现为内联元素。
.element {display: inline;
}
内联块级元素
内联块级元素兼具内联元素和块级元素的特点,不会独占一行,但可以设置宽度和高度。将display
属性设置为inline-block
,可以使元素表现为内联块级元素。
.element {display: inline-block;
}