html标签分类

252 阅读1分钟

html标签可分为3这种类型

1、块级元素
2、行内块元素
3、行内元素(内敛元素)

1、块级元素

特性:
    1. 独占一行
    2. 可以设置宽高
    3. `margin``padding`的上下左右均有效
    4. 可使用margin: 0 auto;自动居中
常见的块级元素:
    <div>、<p>、<h1>...<h6>、<ol>、<ul>、<dl>、<table>、<address>、<form>

2、行内块元素

特性:
    1. 不独占一行
    2. 可以设置宽高
    3. `margin:0 auto`无效
    4. 水平排列,但所有元素默认会有1个空格的间隙,因为元素之间在html中书写有回车换行,浏览器解析会将其解析成一个空格。
常见的行内块元素:
    <img>、<input>、<button>

3、行内元素

特性:
    不独占一行
    不可设置宽高
    margin、padding只有水平方向有效
常见的行内元素:
    <a>、<span>、<i>、<em>、<strong>、<label>、<q>、<var>、<cite>、<code>

3中类型互相转换

    `display:inline;`转换为行内元素
    `display:linline-block;`转换为行内块元素
    `display:block;`转换为块级元素