H5+CSS+JS:div布局

最新推荐文章于 2024-08-14 02:19:53 发布

mjhap

最新推荐文章于 2024-08-14 02:19:53 发布

阅读量1.7k

点赞数

分类专栏：前端文章标签： H5

本文链接：https://blog.csdn.net/mjhap/article/details/82185252

版权

前端专栏收录该内容

8 篇文章 0 订阅

订阅专栏

div布局

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>div布局</title>
    <style type="text/css">
        body{
            margin: 0px;
        }
        div#container{
            width: 100%;
            height: 950px;
            background-color: #fa3a44;
        }
        div#heading{
            width: 100%;
            height: 10%;
            background-color: chartreuse;
        }
        div#content_menu{
            width: 30%;
            height: 80%;
            background-color: aqua;
            float: left;
        }
        div#content_body{
            width: 70%;
            height: 80%;
            background-color: aquamarine;
            float: left;
        }
        div#footing{
            width: 100%;
            height: 10%;
            background-color: blueviolet;
            clear: both;
        }
    </style>
</head>
<body>
    <div id="container">
        <div id="heading">头部</div>
        <div id="content_menu">内容菜单</div>
        <div id="content_body">内容主体</div>
        <div id="footing">底部</div>
    </div>
</body>
</html>