————8 定位网页元素————
51.Position属性：指定盒子的位置，相对它父级的位置或它自身应该在的位置。
(1)static 默认无定位，元素按照标准文档布局。
(2)relative相对定位
a.特性:
1.以标准文档流排版为基础，相当于它在原来位置偏移指定的距离。
2.元素位置偏移后，仍会保留原位置。
3.层级提高，可以遮盖标准文档流元素和浮动元素。
b.使用场景：
相对定位可以不设偏移量，让后面的绝对定位以它为祖先元素作基准定位。
c.语法 position:relative,指定偏移量时：水平left(正值向右移)、right(正值向左),垂直top(正值向下)、bottom(正值向上)。如div{
position: relative;
top:-20px;
left:20px;
}
(3)absolute绝对定位
a.特性：
1.以已定位的祖先元素作基准定位，如果没有定位的祖先元素，则以浏览器窗口为基准定位。
2.元素位置偏移后，不保留原位置(其他元素可以用它原来的空位)
3.层级提高，可以遮盖标准文档流元素和浮动元素。
4.设置绝对定位的元素脱离文档流，对其他盒子的定位无影响
b.使用场景：下拉菜单、焦点图轮播、弹出数字气泡、特别花边等。
(4)fixed固定定位
a.特性：直接以浏览器窗口为基准定位，偏移位置不受窗口滚动条滚动的影响。
b.使用场景：窗口边缘的固定广告、返回顶部图标、边缘固定导航栏等。
52.z-index属性：设置定位元素的堆叠顺序。默认值0，值大的层位于值小层的上方。
(1)网页中的元素都含有两个堆叠层级，一个是未设置绝对定位时所处的环境，此时z-index是0；另一个是设置绝对定位时所处的堆叠环境，此时层的位置由z-index的值确定。
53.设置元素透明度的方法(通常两种方法搜设置以适应所有浏览器兼容)
(1)opacity:x x值为0~1，值越小越透明
(2)filter:alpha(opacity=x) x值为0~100，值越小越透明
HTML CSS整理笔记更多笔记
