发表于: 2019-06-14 21:59:59

1 763


今天完成的事情:今天了解了static relative absolut fixed

在默认情况下,position的值就是static。

  •  relative:对象遵循正常文档流,依据top,right,bottom,left等属性在正常文档流中偏移位置。而其层叠通过z-index属性定义。相对定位,今天通过一个简单的DEMO知道其相对的是自己原来的位置的定位它占用文档空间,且top,right,bottom,left等属性不会移动文档空间。也就是说后面的元素依旧会以其原来位置进行的定位而前一元素的margin值会移动后面元素的文档空间。
  • absolute:对象脱离正常文档流,使用top,right,bottom,left等属性进行绝对定位。而其层叠通过z-index属性定义。其根据祖先类元素(父类以上)进行定位,且祖先类元素必须是以position的非static方式,直到追溯到html标签。值得注意的是在用absolute时,需要添加top,right,bottom,left属性中任一个,才会脱离文本流。而祖先类的margin会让子类absolute偏移。
  • fixed:脱离正常文档流,并且能够根据top、right、left、bottom属性进行定位。(relative 和 fixed都是以bod进行的定位)

明天计划的事情: 完成任务4
遇到的问题:在对header进行编写时,去除 登录 相关内容时,界面发生改变 ,而后通过设定一定的header高而解决。 


收获:初步明白了 relative absolute fixed 的基本内容


返回列表 返回列表
评论

    分享到