HTML元素分类、定位简单总结

元素分类

块级元素：内置属性为display:block;

<div>块级</div>特点：1、独占一行2、在不设置宽高的情况下，宽度是父级元素内容的宽度，高度是本身内容的高度3、可以设置宽高4、可以设置内外边距5、块级元素可以进行任何元素的嵌套

内联元素：内置属性为display:inline;

<span>内联</span>特点：1、和其他的文字或者内联元素在一行显示2、默认宽高就是内容的宽高3、不能设置宽高4、设置内外边距的时候，只有左右起作用5、内联元素不能嵌套块级元素（规范）  

相对定位

特点：1、没有脱离文档流2、不会影响其他元素3、相对定位的元素会覆盖在文档流内元素的上面

绝对定位

特点：1、脱离文档流2、定位的元素将文档内的元素覆盖3、默认的参照物：绝对定位元素默认的参照物是它第一次读取的可视窗口的位置，如果这个页面加宽，加高，也不会改变定位元素的位置4、参照物人为的设定：        {            1、参照物需要是定位元素的父级元素；            2、这个父级元素需要有position这个属性（相对定位、绝对定位、固定定位）        }   

z-index

1、父子元素不参与z-index比较 2、两个盒子比较z-index的时候，如果同级盒子都有z-index值，那么同级之间比较，如果两个同级盒子没有这个值，那么里面的子集盒子的z-index起作用（只作用于这个子集盒子）```    <div class="div1">        <p class="content1"></p>    </div>    <div class="div2">        <p class="content2"></p>    </div>      ```