`
yangxianjiangg
  • 浏览: 62040 次
  • 性别: 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`属性是一个至关重要的概念,它决定了元素在页面上的定位方式。本文件主要探讨了`position`属性的两个关键值:`relative`和`absolute`,这些知识点对于创建复杂的网页布局至关重要。 首先,...

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

    《CSS position属性详解:absolute, relative及其他值》 在网页设计中,CSS(层叠样式表)的position属性是至关重要的,它决定了元素在页面上的布局方式。position属性有五个基本值:static、relative、absolute、...

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

    在CSS中,`background-position`属性是一个非常重要的部分,它控制着背景图像在元素内的位置。这个属性允许我们精确地定位背景图像,从而实现各种视觉效果。 批量输出`background-position`属性的定位像素值通常是...

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

    CSS中的position属性用于指定元素在文档流中的定位方式,它决定了元素在页面上的布局和交互方式。position属性包含四个可能的值:static、fixed、relative、absolute,下面逐一详细说明。 1. static定位:这是...

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

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

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

    在CSS布局中,`position`属性是一个至关重要的概念,它决定了元素如何相对于其周围环境定位。当`position`属性设置为`absolute`时,元素将脱离正常的文档流,并且其位置是相对于最近的一个非`static`定位的祖先元素...

    css背景属性案例

    ### CSS背景属性详解与实践案例 #### 一、引言 在网页设计中,CSS (Cascading Style Sheets) 背景属性是用于控制页面背景的重要工具之一。通过合理运用这些属性,可以极大地增强页面的视觉效果和用户体验。本文将...

    CSS Position

    "CSS Position"是一个关键概念,它决定了元素在页面上的位置和排列方式。理解并掌握CSS定位对于创建响应式、动态且布局精确的网页至关重要。 **定位模式** CSS提供了几种定位模式,包括静态定位(static)、相对...

    CSS代码属性大全.txt

    ### CSS代码属性大全:深入解析CSS主要属性 在网页设计与开发领域,CSS(层叠样式表)扮演着至关重要的角色,它负责控制HTML元素的布局、颜色、字体等视觉表现,使网页更加美观和易读。下面,我们将对《CSS代码属性...

    float与position属性

    " Float与Position属性" Float 与 Position 属性是 CSS 中两个重要的概念,它们可以帮助开发者建立复杂的布局,实现多年的梦想。通过这两个属性,可以将布局的一部分与另一部分重叠,还可以完成多年来通常需要使用...

    CSS常用属性一览表

    以上列出的CSS属性仅为一部分,CSS还提供了许多其他功能强大的属性,如布局管理(`display`, `position`), 过渡效果(`transition`), 动画(`animation`)等,使得开发者能够创建出更加丰富多彩且交互性强的网页界面。

    CSS常用属性列表

    本文将深入探讨CSS的常用属性,帮助您更好地理解和掌握这一核心技能。 1. **选择器**:CSS的选择器是用于匹配HTML元素的方式,如`class`、`id`、`tag name`等。例如,`.myClass`代表具有特定类名的元素,`#myID`...

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

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

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

    在网页设计中,CSS的position属性是一个非常重要的属性,它允许开发者控制元素在页面上的定位方式。position属性有几个值:static、relative、absolute、fixed以及最近添加的sticky。 1. static:这是position属性...

    2.2.38 CSS列表属性(三)列表项目符号位置:list-style-position.docx

    CSS 列表属性 - list-style-position 属性详解 在 CSS 中,列表属性 play 一个非常重要的角色,因为它们可以帮助我们更好地控制列表的样式。今天,我们将要探讨的就是 list-style-position 属性,该属性可以控制...

Global site tag (gtag.js) - Google Analytics