相对定位:position:relative;

  不脱离文档流,参考自身静态位置通过top,bottom,left,right定位,并且可通过z-index进行层次分级。

绝对定位:position:absolute;

  脱离文档流,通过top,bottom,left,right定位,选取其最近的父级元素进行定位,当父级元素position为static时,absolute元素将以body坐标原点进行定位,可通过x-index层次分级。

固定定位:position:fixed;

  这里他所固定的对象是可视窗口而并非body,或父级元素,可通过z-index进行层次分级。

CSS定位:相对定位、绝对定位和固定定位(relative absolute fixed)的更多相关文章

  1. css定位:相对定位、绝对定位、固定定位的区别与特性

    css定位:相对定位.绝对定位.固定定位的区别与特性 原文地址:http://www.qingzhouquanzi.com/106.html css定位常用的有以下三种: 使用了定位的共同特性: 这三 ...

  2. WEB学习 -相对定位、绝对定位、固定定位、z-index

    相对定位 相对定位,就是微调元素位置的.让元素相对自己原来的位置,进行位置调整. .不脱标,老家留坑,形影分离 也就是说相对定位不脱标,真实位置是在老家,只不过影子出去了,可以到处飘. 3.相对定位用 ...

  3. css的定位,relative/absolute/fixed的用法

    其实position的值有四个,static/relative/absolute/fixed,而static是默认值,不算具有有定位属性,这里就不讲了. 定位其实就是跟元素设置定位属性,然后设置其对位 ...

  4. CSS之定位,relative/absolute/fixed的用法

    其实position的值有四个,static/relative/absolute/fixed,而static是默认值,不算具有有定位属性,这里就不讲了. 定位其实就是跟元素设置定位属性,然后设置其对位 ...

  5. css 浮动 相对定位 绝对定位区别

    今天下班在地铁上看了一个样式教学视频,因为最近在学习前端.以前刚毕业的时候,感觉后台才是王道,但最近发现,前端也很重要,比如:自己接一些私单做的时候,自己要根据需求做好界面,才能更加符合客户需求,不然 ...

  6. CSS position relative absolute fixed

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

  7. css属性position: static|relative|absolute|fixed|sticky简单解析

    目录 static 静态定位(默认) relative 相对定位 正常文档流 加了relative之后的布局 加上margin/padding/border之后的布局 absolute 绝对定位 正常 ...

  8. What is the difference between position: static,relative,absolute,fixed

    What is the difference between static,relative, absolute,fixed we can refer to this link: expand

  9. CSS学习笔记10 相对定位,绝对定位与固定定位

    文档流中的元素的位置由元素在 (X)HTML 中的位置决定,这就是最原始的普通流,前面讲到的浮动CSS学习笔记08 浮动可以改变元素在文档流中的位置,除了这个我们还可以通过使用CSS的position ...

随机推荐

  1. hustoj 1017 - Exact cover dancing link

    1017 - Exact cover Time Limit: 15s Memory Limit: 128MB Special Judge Submissions: 5851 Solved: 3092 ...

  2. 【技术贴】解决myeclipse SVN 提交代码 commit:remains in tree-c

    [技术贴]解决myeclipse SVN 提交代码 commit:remains in tree-conflict错误的解决办法 错误是:Aborting commit: xxxxx' remains ...

  3. Qt写的截图软件包含源代码和可执行程序

    http://blog.yundiantech.com/?log=blog&id=14 Qt写的截图软件包含源代码和可执行程序 http://download.csdn.net/downloa ...

  4. 精通iOS开发(第5版)

    <精通iOS开发(第5版)> 基本信息 原书名:Beginning ios 6 development:exploring the ios sdk 作者: (美)David Mark   ...

  5. Node.js权威指南 (2) - Node.js中的交互式运行环境——REPL

    2.1 REPL运行环境概述 / 102.2 在REPL运行环境中操作变量 / 102.3 在REPL运行环境中使用下划线字符 / 122.4 在REPL运行环境中直接运行函数 / 122.5 在RE ...

  6. 【转】Android ROM研究---Android build system增加模块

    原文网址:http://hualang.iteye.com/blog/1141315 Android build system就是编译系统的意思 在我们需要向自己编译的源代码中增加模块的时候,需要一些 ...

  7. php5.4下安装ECshop出现错误的解决办法

    转:http://www.programmernote.com/?p=65 1.安装是会提示 Warning: date_default_timezone_get(): It is not safe ...

  8. IE浏览器兼容性的痛苦

    做了一个弹出框的demo,在狐火,chrome,IE11中运行得好好的. 但是在IE8中死活不显示对话框,感觉IE8根本没有执行下面的javascript代码. 甚至,我简单的写alert(123), ...

  9. SQL Server阻止了对组件xp_cmdshell过程的解决方案

    使用SQL tools连接sqlserver时候出现以下问题: SQL Server阻止了对组件xp_cmdshell过程的解决方案错误描述:SQL Server阻止了对组件‘xp_cmdshell’ ...

  10. RTP, RTCP, RTSP 协议介绍

    流媒体是边下载边播放的方式, 是视频会议.IP电话等应用场合的技术基础.           为什么TCP/IP协议就不能满足多媒体通信的要求呢?因为TCP有以下4个特点:1.TCP重传机制2.TCP ...