`
抽风的鱼
  • 浏览: 49825 次
  • 性别: Icon_minigender_2
  • 来自: 杭州
文章分类
社区版块
存档分类
最新评论

position :static ,relative ,absolute,fixed

 
阅读更多

static :在layout流中,且位置固定,不受top,left,right,bottom影响(如有需要使用relative)

relative: 在layout流中,虽然受top,left,right,bottom影响,但在原来的地方占据空间

absolute:脱离layout流,根据top,left,right,bottom元素来确定位置。

fixed: 脱离layout流,根据top,left,right,bottom元素来确定位置,但是基于浏览器界面左上角为原点,不受滚动条的影响,一致固定在这个位置。

分享到:
评论

相关推荐

    CSS中的position:relative;的作用示例介绍

    引用 static : 无特殊定位,对象遵循HTML定位规则 absolute : 将对象从文档流..."对于页面中一个static的div#demo,我想让这个#demo里的一个div#sub相对于#demo定位在右上角的某个地方,应该是用这个position:relative

    CSS使用position:sticky 实现粘性布局的方法

    position: static; position: relative; position: absolute; position: fixed; } 在https://developer.mozilla.org/zh-CN/docs/Web/CSS/position还说了下面这三个值: /* 全局值 */ position: inherit; position: ...

    详解CSS中position属性介绍(新增sticky)

    position的含义是指定位类型,取值类型可以有:static、relative、absolute、fixed、inherit和sticky,这里sticky是CSS3新发布的一个属性。 1、position: static static(没有定位)是position的默认值,元素处于正常...

    css常见定位属性的使用

    在CSS中关于定位的内容是:position:relative | absolute | static | fixed。static 没有特别的设定,遵循基本的定位规定,不能通过z-index进行层次分级。在本文中,任何一个元素都被文本流所限制了自身的位置,但是...

    css元素常见定位应用.html

    在CSS中关于定位的内容是:position:relative | absolute | static | fixed。static 没有特别的设定,遵循基本的定位规定,不能通过z-index进行层次分级。在本文中,任何一个元素都被文本流所限制了自身的位置,但是...

    Position属性之relative用法

    position的默认值是static,(也就是说对于任意一个元素,如果没有定义它的position属性,那么它的position:static) 如果你想让这个#demo里的一个div#sub相对于#demo定位在右上角的某个地方,应该给#demo相对定位,...

    css中position属性(absolute|relative|static|fixed)概述及应用

    position属性的相关定义:static:无特殊定位,对象遵循正常文档流;relative:对象遵循正常文档流;absolute:对象脱离正常文档流fixed:对象脱离正常文档流,有兴趣的朋友可以参考下哈

    CSS之Position详解

    CSS之Position详解 CSS的很多其他属性大多容易理解,比如字体,文本,背景等。有些CSS书籍也会对这些简单的属性进行大张旗鼓的介绍,而偏偏忽略了对...relative absolute fixed static 下面分别讲述这四个属性....

    深入理解css中position属性及z-index属性(推荐)

    position属性共有四种不同的定位方法,分别是static、fixed、relative、absolute。最后将会介绍和position属性密切相关的z-index属性。 第一部分:position: static static定位是HTML元素的默认值,即没有定位,元素...

    CSS 层叠加的5条原则

    动态定位:position:relative或position:absolute或position:fixed。 祖元素:任意包含该元素的元素。 父元素:直接包含该元素的祖元素。 同辈元素:拥有共同的父元素的元素。 注:这些概念为作者自定义,仅...

    详解css position 5种不同的值的用法

    position属性 position属性指定用于...position:static; 默认情况下,HTML元素定位为静态。静态定位元素不受top,bottom,left和right属性的影响。 元素position:static;没有以任何特殊方式定位; 它总是根据页面的正

    CSS中Position四个属性的使用介绍

    position:static | relative | absolute | fixed 取值: static:默认值,无特殊定位,对象遵循正常文档流。top,right,bottom,left等属性不会被应用,默认值。 relative:相对定位,对象遵循正常文档流,但将...

    div的position属性

    fixed:表示固定定位,与absolute定位类型类似,但它的相对移动的坐标是视图(屏幕内的网页窗口)本身。由于视图本身是固定的,它不会随浏览器窗口的滚动条滚动而变化,除非你在屏幕中移动浏览器窗口的屏幕位置,或...

    css中position属性使用详解

    positon有4个属性:static relative absolute fixed,我们都知道absolute是绝对定位,relative是相对定位,但是这个绝对与相对是什么意思呢?绝对是什么地方的绝对,相对又是相对于什么地方而言的呢?那他们又有什么...

    css中定位中的absolute和relative是什么意思

    做一些浮动层等特殊特殊效果时要考虑到定位问题就要用到Position属性,其有四个属性值:static、fixed、absolute和relative,想必后面两个大家都熟悉吧

    简明CSS定位属性position

    用法:position:static(默认) | fixed | relative | absolute static 遵守正常的文档流,不设置top,bottom,left,right值。 fixed 脱离正常的文档流,完全以浏览器窗口为参照物,不随鼠标的滚动而滚动。设定...

    CSS中的 position属性sticky详解

    position的含义是指定位类型,取值类型可以有:static、relative、absolute、fixed、inherit和sticky,这里sticky是CSS3新发布的一个属性。我今天重点要说的就是sticky属性 position:sticky用法 position:sticky 被

    三星9305收索

    none}body,form,#fm{position:relative}td{text-align:left}img{border:0}a{color:#00c}a:active{color:#f60}.bg{background-image:url(http://s1.bdstatic.com/r/www/cache/static/global/img/icons_a7f1d98c.png);...

    详解css 定位与定位应用

    在CSS中关于定位的内容是:position:relative | absolute | static | fixed static 没有特别的设定,遵循基本的定位规定,不能通过z-index进行层次分级。relative 不脱离文档流,参考自身静态位置通过 top,bottom,...

    CSS样式表中的position属性详细说明

    position: relative | absolute | static | fixed static(静态) 没有特别的设定,遵循基本的定位规定,不能通过z-index进行层次分级。 relative(相对定位) 对象不可层叠、不脱离文档流,参考自身静态位置通过 top,...

Global site tag (gtag.js) - Google Analytics