CSS深入理解學習筆記之relative

標籤：布局   影響   存在   屬性   筆記   fixed   absolute   strong   元素   

1、relative和absolute的相煎關係

限制作用：1限制left/top/right/bottom定位；2限制z-index層級；3限制在overflow下的囂張氣焰

relative和fixed限制作用：限制z-index層級

2、relative和定位

 

特性：1相對自行進行定位；2無侵入，不影響其他元素布局

top/bottom和left/right對立屬性同時存在時的表現：top>bottom left>right

3、relative和層級

提高元素的層疊上下文

建立層疊上下文與層級控制：relative元素的z-index是auto的時候，不會限制子項目的層疊

4、relative的最小化影響原則

定義：盡量降低relative屬性對其他元素或者布局的潛在影響

原則：1盡量避免使用relative，2relative最小化，將需要absolute定位的元素放到一個空的relative元素中

 

CSS深入理解學習筆記之relative