---恢复内容开始---

static:静态定位，也是postion的默认值，没有定位，元素出现在正常的流中，忽略top\bottom\left\right或者z-index声明。

relative:相对定位，生成相对定位的元素，通过top\bottom\left\right的设置相对于其自身的位置进行定位。可以通过z-index进行层级分级。

absolute:绝对定位，生成绝对定位的元素，相对于static定位以外其他定位（如relative\absolute\fixed）的第一个父元素进行定位，如果父元素没有定位则相对于浏览器窗口定位，可以通过z-index进行层级分级。

fixed:固定定位，生成绝对定位的元素，相对于浏览器窗口进行定位。元素的位置通过left\top\right\bottom属性进行规定。可以通过z-index进行层级分级。

fixed属性是相对于浏览器窗口定位且随窗口的滚动而移动，而absolute是相对于浏览器窗口定位但不随窗口的滚动而移动。

---恢复内容结束---

CSS里Postion几个取值relative、absolute、static、fixed的区别和用法的更多相关文章

  1. CSS+DIV定位分析(relative,absolute,static,fixed)

    在用CSS+DIV进行布局的时候,一直对position的四个属性值relative,absolute,static,fixed分的不是很清楚,以致经常会出现让人很郁闷的结果.今天研究了一下,总算有所 ...

  2. css position: relative | absolute | static | fixed详解

    static(静态):没有特别的设定,遵循基本的定位规定,不能通过z-index进行层次分级. fixed(固定定位):这里所固定的参照对象是可视窗口而并非是body或是父级元素.可通过z-index ...

  3. 在jsp的js和css里面使用EL表达式取值|style里面用$取值

    众所周知,如果直接在jsp的js或者css语句块里面写${***}取值的话,程序会不识别这玩意,但是,我们有时候确实需要动态取值,比如,js为了获得对象的某一个值,不方便用js的getElementB ...

  4. 对<tr><td>标签里的input 循环取值

    需求描述:单击table整行,跳转到具体的信息页面  关键就是获取整行的id,传给后台做查询,返回list 解决思路:用带参数函数传过去id,然后在js的函数中用$("#id"). ...

  5. z-index的理解 z-index 属性仅在节点的 position 属性为 relative, absolute 或者 fixed 时生效.

    今天做游戏的Exercise模式的时候,发现把所有的div设置为position:absolute;后,点击play进入到游戏界面的时候,鼠标点击数字的时候,完全没反应.经过我的反复检查,发现只要给所 ...

  6. web（六）css的基本语法、取值与单位

    css语法包含如下部分: 选择器:用于选择需要添加样式的元素. 属性(property):样式的属性名称,例如color代表颜色. 取值与单位:属性对应的值以及单位. 语法规则:css的某些固定语法. ...

  7. JQuery里属性赋值，取值prop()和attr()方法？

    1.赋值的时候 如果是<input type="checkbox" checked>这样的只有属性名就能生效的属性 推荐prop,即:$('input').prop(' ...

  8. CSS宽度高度的百分比取值基于谁

    width=num% , height=num% 基于以下几点 1. 若元素不存在定位: 则基于直接父元素的宽高度 2. 若元素存在定位 且 定位为 relative, 则也基于直接父元素的宽高度 3 ...

  9. 前端JS获取路由地址里的参数QueryString取值

    参数的获取 声明一个函数 //参数name是路由参数 engNo function getQueryString(name) { var reg = new RegExp("(^|& ...

随机推荐

  1. BSOJ 3899 -- 【CQOI2014】 数三角形

    Description 给定一个n*m的网格,请计算三个点都在格点上的三角形共有多少个.下图为4*4的网格上的一个三角形.  注意三角形的三点不能共线. Input 输入一行,包含两个空格分隔的正整数 ...

  2. Linux基础第五课——用户管理

    用户管理 一个用户必须有一个主组 一个用户可以拥有多个组 但是必须一个主组 其它组是临时组 一个组可以拥有多个用户 用户的信息放到 /etc/passwd 用户的密码 存入 /etc/shadow 组 ...

  3. (6)sudo命令详解（每周一个linux命令系列）

    首先说句抱歉,最近事情比较复杂,停更了一阵子.我又回来啦 多用户管理 我们常用的windows个人系统虽然可以设置多用户,但是实际上是不可以多用户同时登陆的(这个我实验过,我以前用windows服务器 ...

  4. Blinker 后台数据分析

    如何解析出后台服务器认证信息,供自己的设备连接. 测试程序 天气 增加了 Debug输出信息功能 1手机APP添加控件信息   2硬件烧录程序 #define BLINKER_PRINT Serial ...

  5. 2017-2018-2 20155314《网络对抗技术》Exp9 Web安全基础

    2017-2018-2 20155314<网络对抗技术>Exp9 Web安全基础 目录 实验目标 实验内容 实验环境 基础问题回答 预备知识 实验步骤--WebGoat实践 0x10 We ...

  6. JavaScript高级程序设计学习(四)之引用类型

    在javascript中也是有引用类型的,java同样如此. javascript常见也比较常用的引用类型就熟Object和Array. 一个对象和一个数组,这个在前后端分离开发中也用的最多.比如aj ...

  7. 18核心的Intel i9将在2019年夏发布

    受工艺和架构限制,Intel HEDT发烧级桌面平台面对AMD早已经优势不再,但升级仍然在继续. 去年10月份,Intel一方面发布了第二代酷睿i9 X系列,仍然基于14nm Skylake-X架构, ...

  8. 使用systemctl报错（centos 7）

    服务器运行210多天,今天使用systemctl准备重启下sshd发现报错,如上图. systemctl restart.stop.status.start等所有操作都报错.原因未知. 在此之前有内存 ...

  9. 看think in java 随笔

    java的方法是运行期动态绑定上去的,可以根据自己真正实例化的类来判断调用哪个方法,比如子类重写了父类方法,会调用子类方法. 而利用final关键字可以让方法不能重写,就可以在编译期就绑定,这样就可以 ...

  10. kubernetes 集群机器重启后磁盘盘符变化

    1.[root@pserver78 ~]# kubectl -n rook-ceph exec -it rook-ceph-tools-c95b8496b-g4stp -- ceph osd tree ...