块级元素
1.独占一行
2.宽度是父容器的100%
3.宽度 高度 外边距 内边距都可以灵活设置
4.是一个容器和盒子,里面可以放块元素或者行内元素
注意:
只有文字才能组成段落P 因此P里面不能放块级元素 特别P不能放 div.
同理还有h1 h2 h3 h4 h5 h6 dt 他们都是文字类块级标签 里面不能其他块级标签
行内元素
1.相邻行内元素在一行上.一行可以显示多个
2.宽高直接设置是无效的
3.默认宽度是本身内容的宽度
4.行内元素只能容纳文本或者其他行内元素.
注意
链接里边不能再放链接
特殊情况链接里边可以放块元素,但是给a 转换一下块级模式最安全.
行内块元素
1.和相邻行内元素(行内块)在一行上,但是中间会有空白间隙 一行可以显示多个
2.默认宽度是他本身内容的宽度
3.宽度 高度 内边距 外边距 可以灵活设置.
ex. img input td标签
三者区别
模式 | 排列 | 样式 | 宽度 | 包含 |
块级元素 | 一行只能放一个块级元素 | 可以设置宽度和高度 | 容器 的100% | 可以包含任何标签 |
行内元素 | 一行可以放多个行内元素 | 不可以直接设置宽度和高度 | 它本身内容的宽度 | 只能容纳文本或者其他行内元素 |
行内块元素 | 一行可以放多个行内块元素 | 可以设置宽度和高度 | 它本身内容的宽度 |