css 全局撑开页面


一定设置html、body、还有一路的父容器的高度都为100%


<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Documenttitle>
    <style>
        #app{
            display: flex;
            flex-direction: column;
        }
        .Header{
            background: pink;
        }
        .down{
            display:flex;

        }
        .Aside{
            background: #067706;
            width:200px;
        }
        .Main{
            background:gold;
        }
    style>
head>
<body>
    <div id="app">
        <div class="Header">Headerdiv>
        <div class="down">
            <div class="Aside">Asidediv>
            <div class="Main">Maindiv>
        div>
    div>
body>
html>

在这里插入图片描述
这个案例里,只是靠文字撑开高度。

做以下修改。
css 全局撑开页面_第1张图片
css 全局撑开页面_第2张图片
这样就全页面撑开了。

你可能感兴趣的:(html5+css3)