让div高度撑满屏幕的方法

您所在的位置：网站首页 › css自适应高度占满 › 让div高度撑满屏幕的方法

让div高度撑满屏幕的方法

2024-05-30 05:17| 来源: 网络整理| 查看: 265

在body只有一个div的时候，可以通过这样的方式让div撑满整个屏幕。

1.给div设置定位。

复习一下——

css中position有五种属性：

static:默认值，没有定位

absolute:绝对定位，相对于父级元素进行定位

relative:相对定位

fixed:固定定位,相对于浏览器窗口进行定位

inherit:从父元素继承定位信息

除了默认值static和inherit之外，添加其他三种都可以实现窗口自适应。

在这里插入代码片 2 *{ 3 margin: 0; 4 padding: 0; 5 } 6 div{ 7 width:100%; 8 height: 100%; 9 background: yellow; 10 position: absolute; 11 } 12 13 14 15 16 17 18 19 20 ----------

2.通过将html设为高度百分百

2 *{ 3 margin: 0; 4 padding: 0; 5 } 6 html,body{ 7 width: 100%; 8 height: 100%; 9 } 10 div{ 11 width:100%; 12 height: 100%; 13 background: yellow; 14 } 15 16 17 18 19 ———————————————— 版权声明：本文为CSDN博主「chunchun1230」的原创文章，遵循 CC 4.0 BY-SA 版权协议，转

以上为转载原文链接：https://blog.csdn.net/chunchun1230/article/details/80249298

【本文地址】

让div高度撑满屏幕的方法

让div高度撑满屏幕的方法

今日新闻

推荐新闻