文档章节

position定位

_
 _好久不见
发布于 2015/11/30 17:54
字数 309
阅读 46
收藏 1

position定位有四种:

static--静态定位

relative--相对定位

absolute--绝对定位

fixed--固定定位


fixed和absolute的相同点:

一、完全脱离标准文档流。

二、未设置偏移量时,都定位在父元素的左上角。(偏移量--元素设置定位【绝对或相对】后就具有偏移属性和堆叠属性【z-index】)。


fixed和absolute的不同点:

一、设置偏移量时,偏移参照基准不同

absolute:

1.无已定位祖先元素,以<html>为基准偏移,而不是以<body>为基准偏移。

2.有已定位祖先元素,以距其最近的,已经定位的祖先元素为基准偏移。

fixed:

1.无论是否有已定位的祖先元素,都以浏览器的可视窗口为基准偏移。

二、未设置偏移量时

fixed:

1.有定位的祖先元素:以祖先元素为基准定位。

2.以浏览器窗口为基准定位。


当元素设置绝对定位却没有设置宽度时,元素的宽度根据内容进行调节。


相对定位:

1.相对于自身原有位置进行偏移。

2.处于标准文档流中。

3.拥有偏移属性和z-index属性。

© 著作权归作者所有

共有 人打赏支持
_
粉丝 9
博文 24
码字总数 17310
作品 0
西安
私信 提问
07/24 CSS中position总结

我们常常使postion用于层的定位,有时一个布局中有几个小对象,不易用css padding margin进行定位,这个时候我们就可以使用position的absolute、relative(绝对定位、相对定位)来轻松搞定。...

Winnie007
2016/07/27
12
0
解决td标签上的position:relative属性在各浏览器中的兼容性问题

在css中的position属性规定了页面元素的定位类型,它有以下几个值: absolute:绝对定位,相对于static以外的第一个父元素进行定位; fixed:生成绝对定位的元素,相对于浏览器窗口进行定位;...

挨踢旅行者
2014/12/05
0
0
一步一图剖析CSS中的position定位

在CSS布局上float和position是永远说不完的道不尽的话题,它们的应用五花八门,组合技巧千奇百怪.通常如果你不是一个很熟练的Csser,那么你对与position肯定还是一知半解,比如说我自己... posit...

顽Shi
2014/03/21
0
5
CSS中的position定位

position的属性值:static,absolute,relative,fixed. 1 static:position的默认属性,元素出现在正常的流中(忽略top,bottom,left,right,z-index声明)。通常设置position:static;的情况...

核桃白果
2014/03/22
49
0
css position

position的默认值是static,(也就是说对于任意一个元素,如果没有定义它的position属性,那么它的position:static) 如果你想让这个#demo里的一个div#sub相对于#demo定位在右上角的某个地方...

rock912
2014/05/30
124
0

没有更多内容

加载失败,请刷新页面

加载更多

为什么只有你每次提交代码,log里面会出现merge

http://www.cnblogs.com/Sinte-Beuve/p/9195018.html

踏破铁鞋无觅处
2分钟前
0
0
如何学习大数据:spark发布程序

一、对于spark程序只是用于默认的spark包的情况 直接点击pcakage 将程序进行在linux当中进行发布 客户端模式:测试 spark-submit --class com.keduox.App \ --master yarn \ --deploy-mode ...

架构师springboot
2分钟前
0
0
oracle job(定时任务)

创建 定时任务 job declare job number;BEGIN DBMS_JOB.SUBMIT( JOB => job, -- job任务的唯一标识(自动生成) WHAT => 'INSERT into TEXTL (id) VALUES(TEXT......

骑羊放狼灬
6分钟前
0
0
Spring声明式事务在抛出异常时不回滚(RollBack)

Spring声明式事务默认只在RuntimeException时Rollback(回滚),不当的try catch会导致事务不回滚。 spring事务默认运行时异常回滚,RuntimeException 配置时添加异常回滚 rollback-for="Th...

叶落花开
7分钟前
0
0
赋能时空云计算 阿里云数据库时空引擎Ganos上线

随着移动互联网、位置感知技术、对地观测技术的快速发展,时空信息已从传统GIS行业渗透到大众应用及各行各业。从静态POI(兴趣点)到APP位置信息,从导航电子地图到车辆行驶轨迹,从卫星影像...

阿里云云栖社区
9分钟前
0
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部