HTML-通过div来对网页进行排版

使用div对网页进行排版
因为div可以理解为是HTML里面的容器，而且div也可以进行嵌套

<!DOCTYPE html>
<html>
    <head>
        <title>Buju_div</title>
        <style>
            body{
                margin: 0px;
            }
            #container{

                width: 100%;
                height:1000px;
                background-color: darkgray;
            }
            #head{
                width: 100%;
                height: 10%;
                background-color: aqua;
            }
            #Left_menu{
                width: 30%;
                height: 80%;
                background-color: blue;
                float:left;
            }
            #right_body{
                width:70%;
                height: 80%;
                background-color: red;
                float: left;
            }
            #footing{
                width: 100%;
                height: 10%;
                background-color: purple;
                float: left;
            }

        </style>
    </head>
    <body>
        <div id='container'>
            <div id='head'>
                Head_Div
            </div>
            <div id='Left_menu'>ZuoBianCaidan</div>
            <div id='right_body'>Right_menu</div>
            <div id='footing'>Footer</div>
        </div>
    </body>
</html>

在这里插入图片描述

来源：CSDN

作者：毛少雄

链接：https://blog.csdn.net/weixin_43635647/article/details/103655797

标签

div

易学教程内所有资源均来自网络或用户发布的内容，如有违反法律规定的内容欢迎反馈！
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!