定位：
绝对定位：
position:absolute; top:0; left:0;（俩个值必须都有）
值：数字 百分比
好处：
1.主要作用：可以让一个元素在网页中的任何一个位置，而且不干扰页面的布局！position:relative; top:0;left:0;
2.可以做一个页面中绝对居中的块
position:absolute; top:50%; left:50%; margin-top:-块的一半; margin-left:-块的一半;
特性：
1.完全脱离文档流！
2.行内元素加了定位就会变成块元素
（加了定位的这个元素（块元素）在没有固定宽的情况下，默认内容宽高）
3.默认参照物body
（定位元素参照物，首先会从最近的父级一级一级找定位父级，找到以后，定位父级就是它的参照物，如果最后没有找到离自己的最近定位父级，默认是body）
相对定位：
position:relative; top:0;left:0;（后面的俩个值可以不写
为什么？
因为相对定位主要作用：为了给绝对定位做参照物！
）
特性：
1.不脱离文档流
2.不改变元素类型
3.参照物：自己
需求：
1.box1,不脱离文档流
2.box2,是脱离文档流的
3.box2定位参照物还是必须是box1
<div class="box1">智能
<div class="box2">
<div class="box3"></div>
</div>
</div>
============================================
例子：
<div>
<a href="#" class="a1">1</a>
<a href="#" class="a2">2</a>
<a href="#" class="a3">3</a>
<a href="#" class="a4">4</a>
<a href="#" class="a5">5</a>
</div>
***给a标签加了绝对定位，五个a都重叠在一起！
注意：绝对定位后的层级关系：
1.在同为定位元素的标签下
2.后写的标签层级高于先写的
=======================================
全部标签层级关系
普通元素--》浮动--》定位---》z-index:8;
注意：比较层级的时候，优先比较元素类型！
1.在同为定位元素的标签下
2.后写的标签层级高于先写的
3.定位元素里，子元素永远都比父元素层级高！
===========================================
display:none; 消失！
display:block; 显示
hover用法：
必须-移入父级操作子级
也可以移入自己操作自己
==========================================
透明度：
opacity:0.5;--0-1；
filter:alpha(opacity:50);0-100 兼容ie8
注意：
给一个标签添加透明度，它里面所有包的内容也就变透明了！！！！