2020.10.8 定位的叠放顺序绝对盒子居中浮动和定位添加的特性页面布局总结

    科技2025-05-25  16

    定位的叠放顺序

    1.z-index 只适用于已经定位的盒子 2.如果z-index相同 则 遵循就近原则 3.z-index大的在上 4.*注意数字z-index: 1 ;*后面不要加单位

    绝对盒子的居中

    因为当盒子 position: absolute 以后margin:auto就不再适用了 # 相对定位可以直接auto 1.left 页面的百分之五十 2.margin-left:-盒子宽度的一半; css代码: 效果

    浮动和定位添加的特性

    1.当添加了浮动和定位以后,盒子就脱标了可以直接定义盒子宽度和大小
    2.浮动定位不会压住后面的文字,文字会环绕猴子显示
    3.绝对和固定定位会压住后面的文字

    页面布局总结

    标准流:垂直排列 浮动:水平排列 定位: 层叠挤压排列

    页面布局案例

    Processed: 0.014, SQL: 8