博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
5.16
阅读量:4593 次
发布时间:2019-06-09

本文共 567 字,大约阅读时间需要 1 分钟。

定位标签:position

包含属性:relative(相对) absolute(绝对)

 

1.position:relative; 如果对一个元素进行相对定位,首先它将出现在它所在的位置上。然后通过设置垂直或水平位置,让这个元素"相对于"它的原始起点进行移动。(再一点,相对定位时,无论是否进行移动,元素仍然占据原来的空间。因此,移动元素会导致它覆盖其他框)

2.position:absolute; 表示绝对定位,位置将依据浏览器左上角开始计算。 绝对定位使元素脱离文档流,因此不占据空间。普通文档流中元素的布局就像绝对定位的元素不存在时一样。(因为绝对定位的框与文档流无关,所以它们可以覆盖页面上的其他元素并可以通过z-index来控制它层级次序。z-index的值越高,它显示的越在上层。)

3.父容器使用相对定位,子元素使用绝对定位后,这样子元素的位置不再相对于浏览器左上角,而是相对于父容器左上角

4.相对定位和绝对定位需要配合top、right、bottom、left使用来定位具体位置,这四个属性只有在该元素使用定位后才生效,其它情况下无效。另外这四个属性同时只能使用相邻的两个,不能即使用上又使用下,或即使用左,又使用右

转载于:https://www.cnblogs.com/czfzm/p/6864346.html

你可能感兴趣的文章
Android中个人推崇的数据库使用方式
查看>>
关于H.264 x264 h264 AVC1
查看>>
北戴河之旅
查看>>
search for a range(找出一个数在数组中开始和结束位置)
查看>>
一次Mutex死锁的原因探究
查看>>
Notepad++ - 通过语言格式设置自定义语法高亮颜色
查看>>
日记(16)-20140928
查看>>
IIS的应用程序池优化方法
查看>>
HTML5 虚拟键盘出现挡住输入框的解决办法
查看>>
绿色astah简体中文版6.8
查看>>
(三)Installation
查看>>
函数_命名空间和作用域
查看>>
bash正则
查看>>
centos下设置nodejs开机启动
查看>>
Echarts Binning on map 根据真实经纬度渲染数据
查看>>
本地dubbo+zookeeper环境搭建
查看>>
【Oracle 触发器】(2)触发器的分类(语句级/行级)
查看>>
poj3254 状压dp 每行独立 入门水题
查看>>
linux下查看磁盘空间
查看>>
[翻译]Kafka Streams简介: 让流处理变得更简单
查看>>