web前段基础5

position:relative ;

相对定位

特点:

  (1)不影响元素本身的特性;

(2)不影响元素脱离文档流

(3)如果没有定位偏移量,对元素本身没有任何影响。

定位元素位置控制:

top/right/bottom/left  定位元素偏移量。

position:absolute;//绝对定位

(1)使元素脱离文档流

(2)使内嵌元素支持宽高

(3)块属性标签内容撑开宽度

(4)如果有定位父级相对于定位父级发生偏移,如果没有定位父级相对于整个文档发生偏移。

(5)相对定位一般都是配合绝对定位使用。

定位元素层级默认后者层级高于前者

z-index  :[number];定位层级。

body<html<文档;

绝对定位是相当于整个文档发生偏移的;

绝对定位会去找定位父级,然后根据定位父级发生偏移。

opacity:0.5;不透明度。值为0~1;(标准浏览器支持)

IE私有滤镜:filter:alpha(opacity=0~100);如:

filter:alpha(opacity=50);ie8及ie8以下都需要;

position:fixed;固定定位;

特性和绝对定位一样:但是固定定位始终是相当于整个文档进行定位的,不管其父级有没有定位。

ie6不支持固定定位;

position :static;定位的默认值;

position:inherit;从父级继承定位属性的值;

定位元素的问题:

(1)ie6下父级的overflow:hidden是包不住子级的相对定位的;

解决方法,让父级元素也变为定位元素;

(2)ie6下定位元素的父级宽高都为奇数,那么在ie6下定位元素的right和bottom都有一像素的偏差。

解决方法,让父级元素的宽高为偶数;

 

 

 

 

 

 

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值