width: 100%是相对于谁的? |
您所在的位置:网站首页 › 相对还是相对于什么意思 › width: 100%是相对于谁的? |
问题:width: 100%是相对于谁的?
今天在接触到移动端的时候,遇到了一个比较常用的属性设置:width: 100%;。因为对这个属性的用法有些困惑,所以简单地总结了一下。 总结:属性 width:100%;使用情况主要有以下几种。前提条件: 子元素必须是块级元素才能实现宽度的继承 父级元素设置了宽度 当父级元素和子元素只是一般嵌套关系的时候,子元素继承父元素的宽。 当子元素浮动时,也可以完整的继承父元素的宽。 当子元素为position: absolute;的时候,这个时候子元素会逐级向上寻找是否有position: relative;的元素。如果有,则继承该元素;如果没有则宽度是相对于body而言。 当子元素为position: relative;时,width:100%是基于父级元素,而不是找position: relative;的元素 --------特殊--------当元素被设置了postion: fixed的时候,是一直基于body的,其宽度就是body的宽度补充一点:不论box-sizing设置为border-box还是content-box,width继承的都是‘父’级元素的内容区的宽度 参考: width: 100%是相对于谁的? 如何让 height:100% 起作用? html body width height 100%使用 |
今日新闻 |
点击排行 |
|
推荐新闻 |
图片新闻 |
|
专题文章 |
CopyRight 2018-2019 实验室设备网 版权所有 win10的实时保护怎么永久关闭 |