如何让页面撑满整个浏览器屏幕

版权声明:本文为博主原创文章,遵循 CC 4.0 by-sa 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/In_computer/article/details/51822460

下面简单粗暴的用css将一个盒子布满整个屏幕。直接上代码吧

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-COMPATIBLE" content="IE=edge,chrome=1"/>
    <title>full-screen</title>
    <style>
        *{
            margin:0px;
            padding:0px;
        }
        #dd1{
            position: absolute;
            width:100%;
            height:100%;
            background-color: #2f2f2f;
        }
    </style>
</head>
<body>
    <div id="dd1"></div>
</body>
</html>

主要的代段为

            position: absolute;
            width:100%;
            height:100%;

浏览器中的效果如下:


可以看到有颜色的背景是铺满屏幕的,以上即是如何使页面撑满浏览器屏幕。

欢迎指正与讨论

展开阅读全文

没有更多推荐了,返回首页