主页 / 建站知识 /

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

建站知识 2021-07-03 07:55www.168986.cn长沙网站建设

使用定位方法

<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占满整个屏幕的实现方法，希望对大家有所帮助，如果大家有任何疑问请给我留言，长沙网络推广会及时回复大家的。在此也非常感谢大家对狼蚁SEO网站的支持！

上一篇：详解纯css实现瀑布流（multi-column多列及flex布局） 下一篇：详解CSS3原生支持div铺满浏览器的方法

长沙网站设计

Copyright © 2016-2025 www.168986.cn 狼蚁网络 版权所有 Power by