如何让元素支持height:100%效果,有两种方式
- 父级元素设置固定的高度值或者有效的百分比值
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>css测试</title>
</head>
<body>
<div class="d">
</div>
</body>
<style>
html,body{
height: 100%;
width: 100%;
}
div{
height: 100%;
width: 100%;
background-color: aqua;
}
</style>
</html>
2.设置为绝对定位
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>css测试</title>
</head>
<body>
<div class="d">
</div>
</body>
<style>
/* html,body{
height: 100%;
width: 100%;
} */
div{
height: 100%;
width: 100%;
background-color: aqua;
position: absolute;
}
</style>
</html>