`
yangxianjiangg
  • 浏览: 59278 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

CSS position 属性

    博客分类:
  • CSS
CSS 
阅读更多
通过使用 position 属性,我们可以选择 4 种不同类型的定位,这会影响元素框生成的方式。

position 属性值的含义:

static
元素框正常生成。块级元素生成一个矩形框,作为文档流的一部分,行内元素则会创建一个或多个行框,置于其父元素中。
relative
元素框偏移某个距离。元素仍保持其未定位前的形状,它原本所占的空间仍保留。
absolute
元素框从文档流完全删除,并相对于其包含块定位。包含块可能是文档中的另一个元素或者是初始包含块。元素原先在正常文档流中所占的空间会关闭,就好像元素原来不存在一样。元素定位后生成一个块级框,而不论原来它在正常流中生成何种类型的框。
fixed
元素框的表现类似于将 position 设置为 absolute,不过其包含块是视窗本身。
提示:相对定位实际上被看作普通流定位模型的一部分,因为元素的位置相对于它在普通流中的位置。


分享到:
评论
1 楼 haikn 2010-12-09  
   还是搞不明白  !!

相关推荐

    关于CSS position属性值absolute,relative的解释.zip

    关于CSS position属性值absolute,relative的解释.zip

    CSS position属性和实例应用演示

    主要介绍了CSS position属性和实例应用演示,absolute(绝对定位),relative(相对定位),relative与absolute的结合使用以及fixed(固定定位),需要的朋友可以参考下

    批量输出 CSS background-position 属性的定位像素值

    批量输出 CSS background-position 属性的定位像素值

    图解CSS中position属性的定位用法

    其中,CSS position 属性可以取5种值:position: absoluteposition: relativeposition: fixedposition: staticposition: inheritstatic 是 position 默认的属性值。任何应用了 position:static 的元素都处于常规文档...

    CSS position属性absolute relative等五个值的解释

    目前几乎所有主流的浏览器都支持position属性("inherit"除外,"inherit"不支持所有包括IE8和之前版本IE浏览器,IE9、IE10还没测试过),以下是w3school对position五个值的解释: 其中absolute和relative是最常用的...

    css position属性为absolute时其百分值的计算

    当position为absolue时候,其相关属性的百分比是相对它参考的元素(包含块)来进行计算并进行位置渲染的 。 首先我们必须知道: 1、[百分比的参照][1]: 根据包含块计算百分值(1)元素的margin/padding/left/right/...

    CSS position属性的正确解释和实例应用

    目前几乎所有主流的浏览器都支持position属性(inherit除外,inherit不支持所有包括IE8和之前版本IE浏览器,IE9、IE10还没测试过),以下是w3school对position五个值的解释: 其中absolute和relative是最常用的,...

    DIV CSS布局中position属性用法深入探究

    本文向大家描述一下DIV CSS布局中的position属性的用法,position属性主要有四种属性值,任何元素的默认position的属性值均是static,静态。这节课主要讲讲relative(相对)以及absolute(绝对)。 如何学习DIV+CSS...

    CSS之Position详解

    CSS之Position详解 CSS的很多其他属性大多容易理解,比如字体,文本,背景等。有些CSS书籍也会对这些简单的属性进行大张旗鼓的介绍,而偏偏忽略了对一些难缠的属性讲解,有避重就轻的嫌疑。CSS中主要难以理解的...

    css属性详解说明,css属性详解说明

    background 简写属性,作用是将背景属性设置在一个声明中。 background-attachment 背景图像是否固定或者随着页面的其余部分滚动。Scroll随文滚动 background-color 设置元素的背景颜色。 background-image 把...

    CSS的position属性在DIV层中的应用

    定位的话,父DIV设置position:relative后,子DIV的position:absolute就会相对父DIV作绝对定位,接下来为大家介绍下CSS的position属性在DIV层中的应用

    div的position属性

    div的position属性详细讲解 1.流动模型 (块元素,内联元素) 2.浮动模型 (float:) 块状元素这么霸道都是独占一行,如果现在我们想让两个块状元素并排显示,怎么办呢?不要着急,设置元素浮动就可以实现这一愿望。...

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

    在网页设计中,position属性的使用是非常重要的。有时如果不能认识清楚这个属性,将会给我们带来很多意想不到的困难。 position属性共有四种不同的定位方法,分别是static、fixed、relative、absolute。最后将会介绍...

    CSS Position(定位)

    CSS Position(定位) position 属性指定了元素的定位类型。 position 属性的五个值: fixed 定位 元素的位置相对于浏览器窗口是固定位置。 即使窗口是滚动的它也不会移动: 实例 p.pos_fixed { position:fixed; ...

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

    CSS position属性使用说明,需要的朋友可以参考下。

    深入理解css中position属性及z-index属性1

    第三部分:relative定位 第四部分:absolute定位 第五部分:重叠的元素--z-index属性 第六部分:脱离档流导致的问题

Global site tag (gtag.js) - Google Analytics