块级元素和行内元素

时间:2022-01-31 05:40:20

1. 标准文档流

自上而下,具有如下性质:

1. 空白折叠现象,折叠成为一个空格;

2. 高矮不齐,底边对齐;

2. 块级元素和行内元素

标准文档流的标签分为两种,块级元素与行内元素:

块级元素:

1. 占一行,不能与其他元素并列;

2. 能接受宽高;

3. 不设置宽度,则默认为父亲的宽度的100%;

行内元素:

1. 与其他元素并排

2. 不能设置宽高,默认宽度为文字宽度

HTML标签,文本级,容器级

文本级 p span a b u i em

容器级  div h li dt dd

所有的文本级标签都是行内元素,除了p;

所有的容器级标签都是块级元素;

3. 块级元素和行内元素相互转换

利用属性 display:inline 将块级元素设置为行内元素:

块级元素和行内元素

利用属性 display:block 将块级元素设置为行内元素:

块级元素和行内元素