HTML 12.8-12.9 初学

目录

css定位

    绝对定位 position: absolute 

    相对定位  position: relative;

    固定定位  fixed

    z-index

    背景

        图片地址

        背景平铺

        图片位置

            背景固定

    颜色

    字体图标

    轮番图

---

css定位

    绝对定位 position: absolute 

        会覆盖下面文档流的位置，包括文字
        他会依据 body 作为参考进行位置偏移
        使用绝对定位后，不会占有原来的位置
        脱离文档流
        子绝父相
            如果子元素使用绝对定位，则父元素就要用相对定位来让子元素依据最近的父元素进行位置定位
        会根据最近一层拥有父级元素进行偏移

    相对定位  position: relative;

        不会 脱离文档流    会占有原来的位置
        该元素基于原来位置的位置偏移
        位置偏移量    top   left   right  bottom
    粘性定位   sticky
        占有原来的位置，不脱标
        粘性定位可以被认为是相对定位于固定定位的混合，该元素在跨越特定阈值前为相对定位，之后为固定定位

    固定定位  fixed

         使用相对定位后，该元素不会占有原来位置，不会脱离文档流
        该元素会依据当前浏览器窗口进行定位

    z-index

        前提条件是该元素属性必须有定位属性

    背景

        图片地址

      background-image

        背景平铺

        图片位置

            偏移量的字面量单位
            百分比单位
                参考对象是当前父元素
            像素单位

            背景固定

            background-attachment  ：fixed
                一般会使用复合型写法来减少代码量

    颜色

            background-color:aqua

    字体图标

        iconmoon
        iconfont

    轮番图

        bootstrap
        引入，复制代码