块级元素
常见的块级元素有
~
、
、
、
- 、
- 等，是典型的块元素
块级元素的特点- 独占一行。
- 高度，宽度，内外边距都可以控制。
- 宽度默认是容器（腹肌宽度）的100%。
- 是一个容器及盒子，里面可以放行内或者块级元素
注意：
- 文字类的元素内不能使用块级元素
标签主要用于存放文字，因此
里面不能放块级元素，特别是不能放
- 同理，
~
等都是文字类块级元素，里面也不能放其他会计元素
行内元素
常见的行内元素
行内元素的特点- 相邻的行内元素在一行上，一行可以显示多个。
- 高，宽直接设置是无效的。
- 默认宽度就是它本身内容的宽度。
- 行内元素只能容纳文本或其他行内元素。
注意：
行内块元素
常见的行内块元素有——,
,,他们同时具有块元素和行内元素的特点。
有些资料称他们为行内块元素。
行内块元素的特点- 和相邻行内元素(行内块)在一行上，但是他们之间会有空白缝隙。一行可以显示多个(行内元素特点)。
- 默认宽度就是它本身内容的宽度(行内元素特点)。
- 高度，行高、外边距以及内边距都可以控制(块级元素特点)。
元素显示模式转换
特殊情况下，需要元素模式转换，简单理解：就是一个块级的元素需要另外一种模式的特性
比如想要增加的触发范围- display:block;(转换为块级元素)
- display:inline;(转换为行内元素)
- display:inline-block;(转换为行内块元素)
注意：
单行文字垂直居中需要文字的高度(line-height)等于盒子的高度(height)
- 、
若有收获，就点个赞吧
0 人点赞
