absolute:当使用时,表示在文档流中没有实际存在位置(浮动),在不设置任何方位值时,只能按兵不动,当设置了方位值之后,会紧接着去寻找距离最近的能够将它包含住的父级元素,然后进行定位。

relative:当使用时,表示在文档中确实占有一定的空间,在不设置任何方位值时,会出现在应该出现的位置(空间),当设置了方位值之后,会在应该出现的位置上进行上、下、左、右的形状位移,而实际上还是占有应该占有的位置(空间)

css 布局absolute与relative的区别的更多相关文章

  1. Position属性四个值:static、fixed、absolute和relative的区别和用法

    Position属性四个值:static.fixed.absolute和relative的区别和用法 在用CSS+DIV进行布局的时候,一直对position的四个属性值relative,absolu ...

  2. css absolute与relative的区别

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. Div CSS absolute与relative的区别小结

    absolute:绝对定位,CSS 写法“ position: absolute; ”,它的定位分两种情况,如下: 1. 没有设定 Top.Right.Bottom.Left 的情况,默认依据父级的“ ...

  4. css中的position 的absolute和relative的区别(转)

    我们先来看看CSS3 Api中对position属性的相关定义: static:无特殊定位,对象遵循正常文档流.top,right,bottom,left等属性不会被应用. relative:对象遵循 ...

  5. css position: absolute、relative详解

    CSS2.0 HandBook上的解释: 设置此属性值为 absolute 会将对象拖离出正常的文档流绝对定位而不考虑它周围内容的布局.假如其他具有不同 z-index 属性的对象已经占据了给定的位置 ...

  6. position属性absolute与relative 的区别

    连接:https://www.cnblogs.com/duyanli/p/3534005.html 每次要用到Position属性时,总要去搜索下,这两个属性值的区别:今天就直接复制网上的结果,以便以 ...

  7. CSS position: absolute、relative定位问题详解

    CSS2.0 HandBook上的解释:  设置此属性值为 absolute 会将对象拖离出正常的文档流绝对定位,而不考虑它周围内容的布局.假如其他具有不同 z-index 属性的对象已经占据了给定的 ...

  8. Position属性四个值:static、fixed、absolute和relative的区别

    1.static(静态定位):默认值.没有定位,元素出现在正常的流中(忽略 top, bottom, left, right 或者 z-index 声明). 2.relative(相对定位):生成相对 ...

  9. CSS+DIV布局中absolute和relative区别

    原文:http://developer.51cto.com/art/201009/225201.htm 这里向大家简单介绍一下CSS+DIV布局中absolute和relative属性的用法和区别,定 ...

随机推荐

  1. [转载] Redis 起步

    转载地址:http://www.cnblogs.com/shanyou/archive/2012/01/28/2330451.html Rdis和JQuery一样是纯粹为应用而产生的,这里记录的是在C ...

  2. Python: 无参数的函数装饰器

    写带参数的函数装饰器最纠结的是需要包好多层,最外层是接收参数的函数,它返回一个接收函数的的函数.但这样有个问题是,最终包装出来的装饰器必须加()调用一下,即使没有参数也需要这样做,因为调用这个最外层函 ...

  3. Net框架下-ORM框架LLBLGen的简介

    >对于应用程序行业领域来说,涉及到Net框架的,在众多支持大型项目的商用ORM框架中,使用最多的目前了解的主要有三款: 1.NHibernate(从Java版移植来的Net版). 2.微软的EF ...

  4. Oracle 10gR2 & 10.2.0.5 的百度网盘下载地址 :)

    如题: https://pan.baidu.com/s/1eSI770m

  5. Mac OSX 安装nvm(node.js版本管理器)

    我的系统 1.打开github官网https://github.com/,输入nvm搜索,选择creationix/nvm,打开 2.找到Install script,复制 curl -o- http ...

  6. rm: 无法删除&quot;/run/user/root/gvfs&quot;: 是一个目录 问题

    2013-03-02    bxd@linux:~$ sudo su [sudo] password for bxd:  root@linux:/home/bxd# exit exit rm: 无法删 ...

  7. sql like 时间

    and Convert(varchar(),TimeStamp,) like '%2013-09-06 09:46:03%'

  8. hdinfo

    --------[ 鲁大师 ]-------------------------------------------------------------------------------- 版本: ...

  9. Android & CM build basics

    [CM source code folders] bootable/Among other things, the source for ClockworkMod recovery is in her ...

  10. 让文档和Demo生成更加简单和强大 - SmartDoc 0.1.1 说明

    新特性 smartDoc 0.1.1版正式发布,其中加入了更多方便生成文档的功能,主要特性如下: * 加入@demo配置项,看可以动态抓取html和js的内容作为@example,同时支持扩展@dem ...