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

下面简单粗暴的用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%;

浏览器中的效果如下:


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

欢迎指正与讨论

你可能感兴趣的:(html,css,编码)