2.块级元素与行内元素的特点

<!-- <a href="#">a </a>
<img src="demoimg/bg.gif" alt="">
<input type="text">
<select name="a1" id=""></select>
<label for="">label </label>
br进行换行。单独的br标签容易被误以为块集元素。实际上是行内元素<br>
<em>em </em>
<i>i</i>
<strong>strong </strong>
<br> <br> <br> <br> -->

<!-- 1.1行内元素的特点
1.和其他元素都在一行，即行内元素和其他行内元素都会在一条水平线上排列；
2.高度、宽度是不可控的，设置无效，由内容决定。
设置margin左右有效，有边距效果；
设置margin上下会撑大空间但是不会产生边距效果（即盒模型margin-top/bottom有值，但页面上没有边距效果）。
设置padding左右有效，设置padding上下会撑大空间但是不会产生边距效果（同上）。 -->

<!-- <div>div </div>
<table>table </table>
<form action="">
    form
</form>
<p>p </p>
<ul>
    <li>
        li

    </li>
</ul>
<h1>h标签</h1> -->

<!-- 2.1块集元素的特点 
        1.总是从新的一行开始，即各个块级元素独占一行，默认垂直向下排列；
        2.高度、宽度、margin及padding都是可控的，设置有效，有边距效果；
        3.宽度没有设置时，默认为100%；
        4.块级元素中可以包含块级元素和行内元素。-->