position : absolute | relative | fixed | static 定位：子集可以超出父级的范围，如父级蛇overflow：hidden则看不到。

absolute : 绝对定位（脱离文档流） relative : 相对定位（不脱离文档流）

（1.不管父级设为relative还是absolute，而如果子集设为absolute，子集的参考对象仍为父级。若父级不设，则子集的参考对象为body。2.relative是相对于父级来说的，不管父级是absolute还是relative还是不设，都是参考父级。对子集没有影响. 3.父级一般设为relative。） fixed : 相对浏览器窗口定位（脱离文档流） static : 为position的默认值（即不定位）

设为absolute后position后有类似浮动的效果，块标签不再独占一行。且不占父级空间。

定位position的更多相关文章

  1. css　温故而知新 定位(position)与权限(z-index)

    1.进行定位(position)的元素的权限(z-index)永远比没有定位的高. 2.如果两个元素都定位了,无论是相对定位还是绝对定位.他们的权限都是等权的. 3.两个相同定位的元素,除了z-ind ...

  2. 定位 position: absolute & relative

    [position:absolute] 意思是绝对定位,他默认参照浏览器的左上角,配合TOP.RIGHT.BOTTOM.LEFT(下面简称TRBL)进行定位,有以下属性: 1)如果没有TRBL,以父级 ...

  3. css定位position认识

    1.绝对定位(position: absolute) 2.相对定位(position: relative) 3.固定定位(position: fixed) 绝对定位 设置position:absolu ...

  4. div+css定位position详解

    div+css定位position详解 1.div+css中的定位position 最主要的两个属性:属性 absolute(绝对定位) relative(相对定位),有他们才造就了div+css布局 ...

  5. 通过定位position="fixed"实现网页内容的固定层效果

    在网页的顶部或者底部导航栏中经常需要使用到固定层的效果,即紧挨浏览器窗口的顶部或底部而网页其他内容的影响. 一.实现 主要通过设置导航栏元素的位置属性position="fixed" ...

  6. [转载]CSS元素的定位position

    CSS元素的定位position 属性position   值 描述 absolute                             生成绝对定位的元素,相对于 static 定位以外的第一 ...

  7. CSS.04 -- 浮动float、overflow、定位position、CSS初始化

    标准流:行内/行内块元素横向有序排列 : 块元素纵向有序排列. 浮动:Float 语法:float:left/right :  设置浮动的元素,脱离标准流 浮动的框可以向左或向右移动,直到它的外边缘碰 ...

  8. 定位--position属性

    一.定位--position属性 1.static:默认值 没有定位--以标准文档流方式显示 2.relative:相对定位--相对自身原来的位置进行偏移(top left right bottom) ...

  9. 《css定位 position》课程笔记

    这是我学习课程css定位 position时做的笔记! 本节内容 html的三种布局方式 position可选参数 z-index 盒子模型和定位的区别 侧边栏导航跟随实例 html的三种布局方式 三 ...

  10. 定位 position 透明度 opacity

    1.position 定位 position:fixed 固定定位 position:relative 相对定位(不指定父级元素的话相对于document) position:absolute 绝对定 ...

随机推荐

  1. VisualStudio一打开工程就崩溃-重打开output显示We were unable to automatically populate your Visual Studio Online accounts.

    and this method exactly effected on me

  2. Apache Kafka for Item Setup

    At Walmart.com in the U.S. and at Walmart's 11 other websites around the world, we provide seamless ...

  3. util包下的Date与sql包下的Date之间的转换

    Java中的时间类型 java.sql包下给出三个与数据库相关的日期时间类型,分别是: Date:表示日期,只有年月日,没有时分秒.会丢失时间: Time:表示时间,只有时分秒,没有年月日.会丢失日期 ...

  4. 【转】html、css、js文件加载顺序及执行情况

    原链接:http://www.cnblogs.com/Walker-lyl/p/5262075.html 今天看书,看到html,css,js加载执行情况,发现自己并不是真正的了解,网上搜了半小时依然 ...

  5. jvm运行机制与内存管理

    http://blog.csdn.net/lengyuhong/article/details/5953544 http://www.cnblogs.com/nexiyi/p/java_memory_ ...

  6. Angular JS学习之指令

    1.Angular JS通过称为指令的新属性来扩展HTML:通过内置的指令来为应用添加功能: 2.AngularJS指令:AngularJS指令是扩展的HTML属性,带有前缀ng-: **ng-app ...

  7. Java类与对象的基础学习

    1. 请输入并运行以下代码,得到什么结果? public class Test{ public static void main(String args[]){ Foo obj1=new Foo(); ...

  8. CSS3-animation，表格表单的格式化

    animation 1.与transition一样,animation在IE9之前都不支持,不仅如此,还需要大量的供应商前缀 2.定义关键帧:@内容中需要大量的前缀 @keyframes  fadeI ...

  9. 运行re-sign.jar重签名工具报错ERROR:Cannot run program "D:\sdk\tools\zipalign

    今天在使用这个拖拽到具,把apk文件拖到re-sign.jar运行打开的界面,报错如下: ERROR:Cannot run program "E:\Android sdk\sdk\tools ...

  10. AngularJs基础（一）

    使用 angularjs首先在页面的<html>里添加一个模块写法: <html lang="en"ng-app="myApp"> my ...