空间
HTML 空白元素
<br/>
换行<hr/>
分隔线
边距设置
外边距
设置 margin
属性的参数顺序:
四值:上 右 下 左(顺时针)
三值:上 内联流 下
两值:块流 内联流
可以使用负值来与别的元素覆盖,或使用 auto
值来自动分配可用空间。
外边距重叠
一般情况下会发生两个元素的 margin
重叠( collapse )。
比如,如果上一个元素的底部 margin
为 2rem
,下一个元素的顶部 margin
为 3rem
,则两个元素之间间隙会取最大值 3rem
。
可以用 flexbox 等布局取消这一特性。
元素定位
static
:会忽视top
、right
、bottom
、left
值。relative
:相对于元素自身在文档流的位置,不脱离文档流。absolute
:相对于父元素,脱离文档流。fixed
:会固定在视窗上,四距值会基于视窗。sticky
:在滚动的时候会驻留在页面上。
inset
属性是top
、right
、bottom
、left
的合写。
物品间间隔
在 grid 和 flexbox 中可以用 gap
、row-gap
、column-gap
来设置间隔。