css之relative
2018-06-24 00:56:11来源:未知 阅读 ()
一、relative对absolute的限制作用
1、限制left/top/right/bottom定位。absolute默认是在也没的左上角,当父类设定为relative,absolute就被限制在父类的区域内,设定top/left/right/bottom时,起始点为父类的左上角
2、限制z-index层级。页面中的俩个absolute的z-index不同且不为auto,有各自的层级,当这两个absolute的父类都有relative的时候,它们的层级就依赖于父类的relative的z-index
3、限制在overflow下的效果。默认情况下,overflow:hidden是无法限制absolute的,当加上relative时,才能被限制住;当overflow:auto或overflow:scoll时,里面有滚动条,absolute是不会随滚动条移动的,这时就需要加上relative
二、relative只能限制fixed的z-index层级
三、relative和定位
1、relative的定位和偏移都是相对于自身所在的位置
2、relative的定位不会影响其他元素的定位。作用:可以用来自定义拖拽功能
四、relative最小化影响原则
指的是尽量降低relative属性对其他元素或布局的潜在影响
1、尽量避免使用relative
2、必须使用的时候,relative也要最小化
参考地址:http://www.imooc.com/learn/565
标签:
版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有
上一篇:css之absolute
下一篇:css3 UI 修饰——回顾
- DIV居中的经典方法 2020-06-13
- CSS中的float和margin的混合使用 2020-06-11
- Html/css 列表项 区分列表首尾 2020-06-11
- css与javascript重难点,学前端,基础不好一切白费! 2020-06-11
- ie8下透明度处理 2020-06-11
IDC资讯: 主机资讯 注册资讯 托管资讯 vps资讯 网站建设
网站运营: 建站经验 策划盈利 搜索优化 网站推广 免费资源
网络编程: Asp.Net编程 Asp编程 Php编程 Xml编程 Access Mssql Mysql 其它
服务器技术: Web服务器 Ftp服务器 Mail服务器 Dns服务器 安全防护
软件技巧: 其它软件 Word Excel Powerpoint Ghost Vista QQ空间 QQ FlashGet 迅雷
网页制作: FrontPages Dreamweaver Javascript css photoshop fireworks Flash