元素显示模式

元素以什么方式进行显示 如 div、span

HTML一般分为块元素和行内元素

块元素

• 独占一行
• 高度、宽度、内边距、外边距都可以控制
• 宽度默认是父级容器的100%
• 是一个容器及盒子，里面可以放行内或块级元素

<h1>   <p>   <div>  <ul>  <ol>   <li>  ...

其中 h 和 p 标签主要用于存放文字 因此不能放块级元素

行内元素

• 一行可以显示多个
• 高、宽直接设置无效
• 默认宽度就是它本身内容的宽度
• 行内元素只能容纳文本或其它行内元素

<a>

注意 a 标签 链接里不能再放链接

特殊情况 a 标签可以放块级元素，但是给a标签转换下块级模式最安全

行内块元素

在行内元素中有几个特殊的标签 如 img、input、td 它们同时具有块元素和行内元素的特点

• 和相邻的行内元素在一行上，但它们之间会有空白缝隙
• 默认宽度就是它本身内容的宽度
• 高度，宽度，外边距，内边距都可以控制

显示模式转换

display:block : 行内元素转换为块级元素

display:inline : 块级元素转换为行内元素

display:inline-block : 行内元素转换为行内块元素