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;`转换为块级元素