使用css使div占满整个屏幕的实现方法

2024-07-11 08:59:22

字体：大中小

来源：转载

供稿：网友

使用定位方法

<style>*{    padding: 0;    margin: 0;}#myDiv {    width: 100%;    height: 100%;    border: 1px solid red;    position: absolute}</style><body>    <div id="myDiv">        我要全部填满    </div></body>

使用百分比

html和body本身是没有高度的，他们的高度由子元素撑起来

所以设置对应的百分比即可。

<style>*{    padding: 0;    margin: 0;}html{    width: 100%;    height: 100%;}body{    width: 100%;    height: 100%;}#myDiv {    width: 100%;    height: 100%;    border: 1px solid red;    /*position: absolute*/}</style><body>    <div id="myDiv">        我要全部填满    </div></body>

总结

以上所述是小编给大家介绍的使用css使div占满整个屏幕的实现方法，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对武林网网站的支持！

上一篇：详解CSS3原生支持div铺满浏览器的方法

下一篇：详解纯css实现瀑布流（multi-column多列及flex布局）