关于absolute 和 relative 定位的定义
absolute的英文意思是绝对的意思,实际上是针对父级元素元素定位,如果父级元素没有position:relative|absolute,则追至再上一个父级元素,直至相对于文档的左上角定位,按照我们中国人的理解观念,这个其实是相对定位,是脱离文档流的。用了abolute属性,原有float属性将失效;
relative的英文意思是相对的意思,实际上是相对于对象当前位置的定位。而且是不脱离文档流的,就算用top、lef、bottom、right或margin将其移动位置,它也会在原来的文档流中占有自己实际大小的一块位置。
说白了,absolute是相对于父对象定位,relative是相对于当前位置定位!就是这么简单
关于absolute 和 relative 定位的定义的更多相关文章
- focus、click、blur、display、float、border、absolute、relative、fixed
onfocus:获取焦点,点击时,按着不放 onclick:点击松开之后,未点击其他处 onblur:点击松开之后,又点击其他处 display:block,none,inline block:单独占 ...
- 定位 absolute和relative比较
absolute:脱离原来位置定位.是相对于最近的有定位的父级进行定位;如果没有有定位的父级元素,就相对文档进行定位 relative:保留原来位置进行定位,相对于自己原来的位置进行定位 下面举两个例 ...
- Position属性四个值:static、fixed、absolute和relative的区别和用法
Position属性四个值:static.fixed.absolute和relative的区别和用法 在用CSS+DIV进行布局的时候,一直对position的四个属性值relative,absolu ...
- position属性absolute与relative 详解
最近一直在研究javascript脚本,熟悉DOM中CSS样式的各种定位属性,以前对这个属性不太了解,从网上找到两篇文章感觉讲得很透彻,收藏下来,唯恐忘记.一.解读absolute与relative ...
- position属性absolute和relative理解
relative:相对于自身静态位置进行定位,不脱离流. absolute:绝对定位,脱离流,如果父元素定义了position属性,无论是absolute.relative还是fixed,都是相对于父 ...
- CSS+DIV布局中absolute和relative区别
原文:http://developer.51cto.com/art/201009/225201.htm 这里向大家简单介绍一下CSS+DIV布局中absolute和relative属性的用法和区别,定 ...
- position的absolute与fixed,absolute与relative共同点与不同点
absolute与fixed 共同点: (1) 改变行内元素的呈现方式,display被置为block: (2) 让元素脱离普通流,不占据空间: (3) 默认会覆盖到非定位元素上 不同点: absol ...
- CSS中position的absolute和relative用法
static: HTML元素的默认定位方式 absolute: 将对象从文档流中拖出,使用left,right,top,bottom等属性进行绝对定位.而其层叠通过z-index属性定义.绝对定位的元 ...
- css中的position 的absolute和relative的区别(转)
我们先来看看CSS3 Api中对position属性的相关定义: static:无特殊定位,对象遵循正常文档流.top,right,bottom,left等属性不会被应用. relative:对象遵循 ...
随机推荐
- GirdView 追忆学生时代的百思不得解
临近年关,越多越多的园友开始了对工作.生活的总结,以及对来年目标的确立.这很励志,人是一根能思想的苇草,想来想去,我实在没什么惊天地.泣鬼神的英勇事迹,16年毕业季,按部就班的在时间的马车上颠簸,阅读 ...
- CSS 设置背景透明度,不影响子元素
由于 opacity 属性能被子元素继承,使用它设置父元素背景透明度时也会影响子元素. 解决方法: 1> 使用 RGBA Example .classname { /* RGBa, 透明度0.6 ...
- 计算缓存文件大小、清除缓存的Cell
计算缓存文件大小 - (void)getCacheSize { // 总大小 unsigned long long size = 0; // 获得缓存文件夹路径 NSString *cachesPat ...
- 将windows server 2016改造为像windows 10一样适合个人使用的系统
Windows server 2016 RTM已流出,具体可以搜索wzor大神泄露的,英文版本是0911的.现根据我安装后整理的如何配置使个人更适合使用. 20170102更新:wzor泄漏的0911 ...
- T-sql 查询
------------------case---when-------的使用--------------------- select userAccount , eatingDate , c ...
- GDB的深入研究
GDB的深入研究 一.GDB代码调试 (一)GDB调试实例 在终端中编译一个示例C语言小程序,保存为文件 gdblianxi.c 中,用GCC编译. 在上面的命令行中,使用-o参数指定了编译生成的可执 ...
- oracle应用启动时常会报未知服务名
修改/etc/hosts文件 127.0.0.1 localhost localhost.localdomain localhost4 localhost4.localdomain4#::1 loca ...
- centos6.x开机卡死
问题描述: centos6.x开机卡死在进度条处 远程登录,查看系统日志,看看卡在哪儿 通过远程连接,tail -fn 20 /var/log/messages 发现报错: init: prefdm ...
- 【前端】使用readline模块实现Node.js的输入输出
'use strict'; function f(x) { // do something... } var readline = require('readline'); //创建readline接 ...
- awk 高级技巧
netstat -nat |awk '{print $6}'|sort|uniq -c|sort -rn netstat -n | awk '/^tcp/ {++S[$NF]};END {for(a ...