定位“值”多少?

作者: bo_bo_bo_la | 来源:发表于2017-08-25 20:07 被阅读10次

一、定位的属性值

    1、position:fixed

              固定定位。顾名思义,元素设置了固定定位之后,位置不会发生改变。即相对于视窗定位,不论浏览器怎么拖拉,该元素的位置不会发生改变

        1.1、fixed定位对元素的影响

               元素被设置fixed定位之后会完全脱离文档流,不占用HTML的空间。如果是行级元素,设置成fixed定位之后具有块级元素的特性,即可以设置宽高,也可以支持CSS样式;如果是块级元素的话,则该元素会失去对其父级的宽度的继承。这里要注意的是,如果元素设置fixed定位之后,位置必须有初始化,否则我们的可视范围将看不到该元素,并且元素一旦设置了fixed定位之后,在设置float时。将不会生效。

     2、position:relative

              相对定位。即相对于元素自身定位,若给元素设置top与left时,该元素的移动参照物将以自己的当前位置为起点上下左右移动。

         2.1、relative定位对元素的影响

               元素设置成relative之后,将不会脱离文档流,即它当前的位置不会被其他元素所占用。当元素设置成relative时,不会改变行块元素的默认表现形式。一般元素设置成relative之后不会对其自身产生影响,所以一般相对定位是结合绝对定位设置,作为绝对定位的参照点

     3、position:absolute

              绝对定位。如果此时元素的父级没有设置定位元素,则该元素相对于浏览器进行定位,如果元素的父级设置成定位元素,则该元素的参照点为其父级。即以其父级为原点上下左右移动。

         3.1、absolute定位对元素的影响  

               元素一旦设置决定定位之后将会完全脱离文档流,不会占用任何位置。如果是行级元素,设置成fixed定位之后具有块级元素的特性,即可以设置宽高,也可以支持CSS样式;如果是块级元素的话,则该元素会失去对其父级的宽度的继承。

     4、position:static

            默认。位置设置为 static 的元素,它始终会处于页面流给予的位置(static 元素会忽略任何 top、bottom、left 或 right 声明) 

相关文章

  • 定位“值”多少?

    一、定位的属性值 1、position:fixed 固定定位。顾名思义,元素设置了固定定位之后,...

  • 定位

    定位 position属性 static:默认值,没有定位 relative:相对定位 absolute:绝对定位...

  • 定位

    定位 position属性 static:默认值,没有定位 relative:相对定位 absolute:绝对定位...

  • 定位

    定位 position属性 static:默认值,没有定位 relative:相对定位 absolute:绝对定位...

  • css第五节(1)

    1、定位 position常用属性值: static:自动定位,静态定位,默认定位方式 relative:相对定位...

  • absolute与fixed区别

    我们知道,css的position定位属性中,表示绝对定位的有两个值,值absolute与值fixed。 都是绝对...

  • CSS中的定位

    定位 定位的使用包含两个部分:定位的方式偏移值 left,right,top,bottom偏移值准确的理解是“距离...

  • css居中的书写规范——2017.3.4

    元素的定位属性 定位模式 选择器{position: 属性值;} postition属性的常用值 static 自...

  • 定位

    1.static position 是定位属性,属性值包括:static(不定位,默认值) 2.relative ...

  • 有没有哪句话触动到你呢,我是被触动了!

    1、如果你弄不清自己的定位,不妨先试着给自己定价。问问自己,你想让自己值多少钱?或者说,你想赚到多少钱? 根据市场...

网友评论

    本文标题:定位“值”多少?

    本文链接:https://www.haomeiwen.com/subject/aqlpdxtx.html