relative:相对于它本身原来的位置进行偏移(配合 right left bottom top属性进行偏移) 他偏移会空出来一些空白 其余的html元素不会填充这些空白
absolute:相对于同样设置了position属性的父级元素进行偏移(除了position:static)如果没有这样的html元素 就是body(配合 right left bottom top属性进行偏移)

position:relative与position:absolute 区别的更多相关文章

  1. position:relative/static/fixed/absolute定位的区别以及使用场景

    absolute是相对于自己最近的父元素来定位的,relative是相对于自己来定位的 relative 不脱离文档流,absolute 脱离文档流.也就是说:relative 的元素尽管表面上看到它 ...

  2. 通过案例理解position:relative和position:absolute

    w3school过了HTML的知识之后,觉得要自己单纯地去啃知识点有点枯燥,然后自己也很容易忘记,所以便找具体的网站练手便补上不懂的知识点.position:relative和postion:abso ...

  3. position:relative和position:absolute的差别及使用方法

    这几天在做项目时遇到做选项卡的功能时,标题和内容区域的背景颜色不同.且须要选到当前标题时,此标题以下会出现下边框及小三角边框,这样就会超出标题背景颜色需覆盖以下内容区域.这时就须要用到potition ...

  4. css里面position:relative与position:absolute的区别

    position:absolute这个是绝对定位:是相对于浏览器的定位.比如:position:absolute:left:20px;top:80px; 这个容器始终位于距离浏览器左20px,距离浏览 ...

  5. position: relative 和 position: absoution 的详解

    position属性指定一个元素(静态的,相对的,绝对或固定)的定位方法的类型 relative:生成相对定位的元素,相对于其正常位置进行定位. 对应下图的偏移 absolute: 生成绝对定位的元素 ...

  6. CSS--position:relative和position:absolute

    position:relative相对定位 1. 如何定位?每个元素在页面的普通流中会“占有”一个位置,这个位置可以理解为默认值,而相对定位就是将元素偏离元素的默认位置,但普通流中依然保持着原有的默认 ...

  7. css中position:relative的真正理解

    其实话说一直以来也没真正去理解好position:relative的用法的真实意义. 我想很多人实实在在用的多都是position:relative和position:absolute结合起来一起用的 ...

  8. 【CSS】position relative 用法

    Relative是position的一个属性,是相对定位. position的默认值是static,(也就是说对于任意一个元素,如果没有定义它的position属性,那么它的position:stat ...

  9. CSS position relative absolute fixed

    position属性absolute与relative 详解   最近一直在研究javascript脚本,熟悉DOM中CSS样式的各种定位属性,以前对这个属性不太了解,从网上找到两篇文章感觉讲得很透彻 ...

  10. 浅谈position: absolute和position:relative

    一.在此先说一下文档流的概念: 1,文档流定义: 百度百科定义:文档流是文档中可显示对象在排列时所占用的位置. 大多网友的理解:元素的位置由元素在 (X)HTML 中的位置决定.将窗体自上而下分成一行 ...

随机推荐

  1. Oracle11g温习-第一章 1、ORACLE实例

    2013年4月27日 星期六 10:23 1.ORACLE 实例 System Global Area(SGA) 和 Background Process(后台进程) 称为数据库的实例. 2.ORAC ...

  2. @Resource与@Autowired注解的区别

    一.写本博文的原因 年初刚加入到现在的项目时,在使用注解时我用的@Resource.后来,同事:你怎么使用@Resource注解?我:使用它有错吗?同事:没错,但是现在都使用@Autowired.我: ...

  3. BZOJ3895 取石子

    Orz PoPoQQQ 我等蒟蒻只能想到石子数 ≥ 2时的情况...1的时候就爆搜?大概是这个意思 最后再记忆化一下 /**************************************** ...

  4. VGA

    VGA(Video Graphics Array )视频图形阵列,是IBM在1987年随PS/2机一起推出的一种视频传输标准,具有分辨率高.显示速率快.颜色丰富等优点,在彩色显示器领域得到了广泛的应用 ...

  5. Flask初级(四)flash在模板中使用静态文件

    Project name :Flask_Plan templates: 默认设置下,Flask在程序根目录中名为static的子目录中寻找静态文件. 随便找个图片放进去把,命令test.png Fla ...

  6. Lightbox JS v2.0图片切换效果

    代码下载

  7. VS2003在win7 64位的调试

    win7 64位下安装了VS2003 ,在调试时,一直加载不了W3P.解决方案是.打开VS时,右键已管理员身份打开,即可调试.

  8. 网页不能显示PNG验证码的解决办法

    解决方法: 开始->运行,在运行输入框中输入 “regsvr32 c:\windows\system32\pngfilt.dll”(然后点击确定)如果在注册时出现 “已加载c:\windows\ ...

  9. ios平台cocos2d-x播放音频、视频、音效的Demo(支持网络视频)

    最近由ios应用转做游戏,游戏开始时需要播放一个视频,由于本身cocos2d-x播放视频的相关库,在网上搜到的资料都不是很全,我自己试过在cocos2dx直接调用ios的MediaPlayer来播放, ...

  10. logback转义符与MDC

    关于MDC的使用,可以结合filter一块使用,将需要串联的上下文的关键信息,通过header进行传递,然后通过配置%X{userId}将信息打印出来. MDC.put("userId&qu ...