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

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. SQL2008 一直error40 无法连接到localhost

    1. Problem 2. Reason 可能是之前卸载SQL Server时没卸载干净 后来又重新安装时导致默认实例名不能用 就随手写了个SQLMOLORY实例名 但其实系统内这时是有两个SQL实例 ...

  2. CanalSharp.AspNetCore v0.0.4-支持输出到MongoDB

    一.多样输出支持 CanalSharp.AspNetCore是一个基于CanalSharp的适用于ASP.NET Core的一个后台任务组件,它可以随着ASP.NET Core实例的启动而启动,目前采 ...

  3. Handler实现线程间的通信2

    与Handler实现线程间的通信1反过来MainThread中向WorkerThread中发送消息

  4. docker常用常用删除操作

    文章参考 https://blog.csdn.net/superdangbo/article/details/78688904 https://www.cnblogs.com/jackadam/p/8 ...

  5. slf4j+logback搭建超实用的日志管理模块

    文章转自http://www.2cto.com/kf/201702/536097.html slf4j+logback搭建超实用的日志管理模块(对日志有编号管理):日志功能在服务器端再常见不过了,我们 ...

  6. 关于pyquery小知识点

    #表示的是取html中的id元素, . 表示的是取html中的class元素. 如果是标签,就直接用标签名 而它们之间的空格,则表示嵌套关系 单冒号(:)用于CSS3伪类,双冒号(::)用于CSS3伪 ...

  7. 网站性能优化小结和spring整合redis

    现在越来越多的地方需要非关系型数据库了,最近网站优化,当然从页面到服务器做了相应的优化后,通过在线网站测试工具与之前没优化对比,发现有显著提升. 服务器优化目前主要优化tomcat,在tomcat目录 ...

  8. 3150luogu洛谷

    若说代码 那真的是很水 但是 思想却有点意思 这道题是洛谷博弈论专题的第一道入门题, 然而刚开始我是不会做的, 毕竟是道入门题, 我博弈论还没入门呢. 这道题的做法就是: 如果m为偶数, 那么先手赢( ...

  9. 如何在Ubuntu18.04(Bionic Beaver)系统安装Teamviewer远程控制软件

    首先,打开TeamViewer的下载页面,下载Debian/Ubuntu的Deb安装包. 这里有64位和32位安装包选项.可以在Terminal(终端)中输入uname -a 查看自己系统版本是64位 ...

  10. 关于TerraBuilder的扩展开发

    熟悉Skyline的朋友,可能会发现,在最新的6.6的产品体系中,TerraBuilder中用于生成三维地形场景的模块,改成了TerrainBuilder. 通常情况下,这款软件模块,我们主要用它来进 ...