<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>子元素宽度100%的继承情况</title>
<style>
/*父元素是默认的情况下*/
/*子元素定位是默认的情况下是父级宽高*/
/*子元素定位是相对定位的情况下是父级宽高*/
/*子元素定位是绝对定位的情况下是浏览器宽高*/
/*父元素是相对定位的情况下*/
/*子元素定位是默认的情况下是父级宽高*/
/*子元素定位是相对定位的情况下是父级宽高*/
/*子元素定位是绝对定位的情况下是父级宽高*/
/*父元素是绝对定位的情况下*/
/*子元素定位是默认的情况下是父级宽高*/
/*子元素定位是相对定位的情况下是父级宽高*/
/*子元素定位是绝对定位的情况下是父级宽高*/
/*父元素是固定定位的情况下*/
/*子元素定位是默认的情况下是父级宽高*/
/*子元素定位是相对定位的情况下是父级宽高*/
/*子元素定位是绝对定位的情况下是父级宽高*/
.father {
position: fixed;
width:100px;
height: 100px;
background-color: pink;
}
.son {
position: absolute;
left: 30px;
top: 30px;
width: 100%;
height: 100%;
background-color: purple;
}
</style>
</head>
<body>
<div class="father">
<div class="son"></div>
</div>
</body>
</html>
子元素宽度100%的继承情况
猜你喜欢
转载自blog.csdn.net/weixin_40098371/article/details/81489951
今日推荐
周排行