2. 标签的表现形式

标签的表现形式

1. 块状标签

比如：div p h1~h6 form table hr br ul>li ol>li dl>dt/dd

• 设置宽高有效
• 独占一行，换行展示。
• 不写宽度时。宽度是父元素（剩余）宽度的100%。

2. 行内块标签

比如: input select img button

• 设置宽高有效。
• 同行展示。
• 不写宽度时。宽度由内容撑开。

3. 行内标签

比如：a span strong del ins em i b

• 设置宽高无效。
• 同行展示。
• 不写宽度时。宽度由内容撑开。

4. display

display: 修改元素的性质。

• block：设置元素为块元素
• inline：设置元素为行内元素
• inline-block：设置元素为行内块元素
• 转换的必要性：比如可以把a标签转换为块状元素，设置宽高，使用户可点击的区域增大，进而实现一个按钮的样式。

  .box{
        width: 100px;
        height: 100px;
        background-color: pink;
        display: inline;                   /* 转换为行内元素 */
        display: inline-block;             /* 转换为行内块元素 */
        display: block;                    /* 转换为块元素 */
   }