绝对定位（absolute),作用是将被赋予此定位方法的对象从文档流中拖出，使用left，right，top， bottom等属性相对于其最接近的一个最有定位设置的父级对象进行绝对定位，如果对象的父级没有设置定位属性，即还是遵循HTML定位规则的，则依据 body 对象左上角作为参考进行定位。绝对定位对象可层叠，层叠顺序可通过 z-index 属性控制，z-index值为无单位的整数，大的在最上面，可以有负值（目前负值FF不支持）。

注意：必须加left，right，top， bottom等值才能用效果．如： position: absolute;　top:10px;　必须要加top才能有效．

position:fixed　相对于窗口的固定定位,这个会随周围的移动而移动.但给top,left ,right.等无作用.

position:relative　相对定位
　　所谓相对定位到底是什么意思呢，是基于哪里的相对呢？我们需要明确一个概念，相对定位是相对于元素默认的位置的定位。既然是相对的，我们就需要设置不同的值来声明定位在哪里，top、bottom、left、right四个数值配合，来明确元素的位置.不会随别的移动而影响.

绝对定位（absolute)的更多相关文章

  1. div+Css绝对定位(absolute)和相对定位(relative)的总结

    1.没有外Div的情况下 设置绝对定位(absolute)和相对定位(relative)是没有区别的 2.相对定位占位置 而绝对定位不占位置 会漂浮在别的Div之上 3.若父Div没有设置定位,子Di ...

  2. 【随笔】关于绝对定位absolute相对于父元素定位的问题

    绝对定位absolute的官方定义: 设置为绝对定位的元素框从文档流完全删除,并相对于其包含块定位,包含块可能是文档中的另一个元素或者是初始包含块.元素原先在正常文档流中所占的空间会关闭,就好像该元素 ...

  3. 【CSS】 布局之浮动float和绝对定位absolute的选择

    浮动float: 浮动的框可以向左或向右移动,直到它的外边缘碰到包含框或另一个浮动框的边框为止. 由于浮动框不在文档的普通流中,所以文档的普通流中的块框表现得就像浮动框不存在一样.(W3C) 绝对定位 ...

  4. CSS绝对定位absolute详解

    转:https://www.jianshu.com/p/a3da5e27d22b     之前介绍过CSS浮动float详解,本篇介绍的绝对定位absolute和浮动float有部分相似性.如果能理解 ...

  5. 绝对定位( Absolute positioning )

    绝对定位( Absolute positioning ) 之前在介绍定位体系的时候,已经简单的介绍了绝对定位和固定定位.一般情况下,这两种定位的元素, 在 3D 的可视化模型中,处于浮动元素的上方,或 ...

  6. CSS position绝对定位absolute relative

    常常使用position用于层的绝对定位,比如我们让一个层位于一个层内具体什么位置,为即可使用position:absolute和position:relative实现. 一.position语法与结 ...

  7. 深入理解CSS绝对定位absolute

    前面的话 前面已经介绍了定位的偏移和层叠,例子中大量的应用了绝对定位.因为相较于相对定位和固定定位,绝对定位在实际中应用频率更高.应用场景更广泛.本文将介绍使用绝对定位时的具体细节 定义 当元素绝对定 ...

  8. 相对定位relative与绝对定位absolute

    relative:相对定位,并没有脱离原来文档流,依然在原来的位置上,可以通过设置left,top,来设置自己的偏移量,但是它依然占据自己原来的位置,偏移的位置会遮盖其他的元素 absolute:绝对 ...

  9. html/css中相对定位relative和绝对定位absolute的用法

    一.相对定位(position:relative) 1.相对定位:将盒子的position属性设置为relative:可通过left.top.right.bottom设置偏移量. 相对定位基础用法示例 ...

  10. 详细讲解CSS中相对定位relative和绝对定位absolute

    很多朋友问过我absolute与relative怎么区分,怎么用?我们都知道absolute是绝对 定位,relative是相对定位,但是这个绝对与相对是什么意思呢?绝对是什么地方的绝对,相对又是相对 ...

随机推荐

  1. react css module

    <div className={style['content-warp']}></div> <div className={style.search}></d ...

  2. pycharm上传代码到码云错误现象用户密码

    >>出现此时错误说明在pycharm>git登录用户名或密码是错误的(必须填成是自己注册的码云邮箱和密码 不允许出现中文)并且无法在当前修改用户名或密码 >>接下来打开电 ...

  3. jenkins发布java项目

    前言:这台jenkins服务器的环境是前几篇博客一步步做实验做过来,如果有想做这篇博客的实验的朋友,可以移驾去看一下前几篇博客,另外有看着博客做完的博友,可以在下方留言,证明我做的这些都是对的,有看着 ...

  4. PHP微信公众平台OAuth2.0网页授权，获取用户信息代码类封装demo（二）

    一.这个文件微信授权使用的是OAuth2.0授权的方式.主要有以下简略步骤: 第一步:判断有没有code,有code去第三步,没有code去第二步 第二步:用户同意授权,获取code 第三步:通过co ...

  5. mac下 JMeter 4.0 进行多用户接口压力测试

    1.最近在做公司的内部系统,需要进行多用户压力测试,于是上网在官网下载了Jmeter 压缩包,并放在指定的目录解压,打开解压后文件夹到bin目录下: 执行sh jmeter  Jmeter就启动起来了 ...

  6. 邁向IT專家成功之路的三十則鐵律 鐵律十九：IT人待業之道-寬心

    說來很多人可能不相信,筆者從來不把失業當作是一件嚴重的事,相反的我會把它當作是一個很好的轉機.針對一個隨時做好準備的IT人,三個月或半年沒有上班完全沒有甚麼好擔心的.只是如何善用待業的時間,說實在的真 ...

  7. php 的$_POST 和$_REQUEST的区别

    发现$_POST 没数据,而$_REQUEST 有数据 ----------------------------------------- https://stackoverflow.com/ques ...

  8. 百科知识 ass文件如何打开

    直接拖入视频即可播放 鼠标右键 用记事本打开 也有一些软件支持比如POPSUB(也比较方便调整时间轴) 如果你是说如何加载字幕的话 用VOBSUB是最好的... ASS是视频的字幕,和视频放在同一文件 ...

  9. PS 如何制作WIN7的玻璃化透明窗口效果

    1 绘制一个圆角矩形,并将不透明度设为16%以及添加投影效果   2 再次添加外发光效果   3 新建一个图层,再填充一下这个圆角矩形(可以填充为任意颜色,只要和别的颜色区分开来)   4 选中这个区 ...

  10. css3 - 层次选择器

    div div { background: orange; } body>div { background: green; } .active+div { background: lime; } ...