1. 自身特性: 如left,right,top,bottom定位都是相对于自身位置定位。 当left与right同时存在,lfet生效。 当top与bottom同时存在,top生效。 无侵入,保留原始位置,不会影响其他元素的布局。 可运用于《自定义拖拽》场景。2. relati ...
1. 自身特性:
如left
,right
,top
,bottom
定位都是相对于自身位置定位。 当left
与right
同时存在,lfet
生效。 当top
与bottom
同时存在,top
生效。 无侵入,保留原始位置,不会影响其他元素的布局。 可运用于《自定义拖拽》场景。
2. relative与absolute的关系
起到限制作用: 限制内部absolut
元素的left/right/top/bottom
定位 限制内部absolut
元素的z-index
层级 限制内部absolut
元素的可被overflow
溢出隐藏
3. relative与absolute的关系:
只能限制内部fixed
元素的z-index
层级
4. relative与z-index的关系:
设置relative
元素,可以提高层叠上下文 当z-index
为auto
的relative
,则不限制内部absoulte
元素的层级 当z-index
为数值时,则会创建层叠上下文,从而比较的是两个relative
元素的层叠数值大小, 而不是内部元素的比较。
5. 使用原则:
尽量避免使用elative 如使用,尽量缩小控制区域,减少到只包含要限制的内部元素
海外公司注册、海外银行开户、跨境平台代入驻、VAT、EPR等知识和在线办理:https://www.xlkjsw.com
原标题:CSS之 relative 特性
关键词:CSS
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们:
admin#shaoqun.com
(#换成@)。