重要知识点：HTML布局与框架

最新推荐文章于 2023-09-23 18:35:38 发布

OnMy22

最新推荐文章于 2023-09-23 18:35:38 发布

阅读量610

点赞数

分类专栏： HTML5

本文链接：https://blog.csdn.net/weixin_38654336/article/details/80151036

版权

HTML布局

例子：

1.div布局

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>div布局</title>
    <style type="text/css">
        body{
            margin: 0px;
        }
        div#container{    /*这里的div可以选择删掉，效果一样*/
            width: 100%;
            height: 950px;
            background-color: aquamarine;
        }
        div#heading{
            width: 100%;
            height: 10%;
            background-color: chocolate;
        }
        div#content_menu{
            width: 30%;
            height: 80%;
            background-color: darkgreen;
            float: left;   /*浮动从左到右*/
        }
        div#content_body{
            width: 70%;
            height: 80%;
            background-color: antiquewhite;
            float: left        /*浮动从左到右*/
        }
        div#footing{
            width: 100%;
            height: 10%;
            background-color: brown;
            clear: both;   /*清除浮动*/
        }
    </style>
</head>
<body>
    <div id="container">
        <div id="heading">头部</div>
        <div id="content_menu">内容

最低0.47元/天解锁文章

OnMy22

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
重要知识点：HTML布局与框架

HTML布局例子：1.div布局&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;div布局&lt;/title&gt; &lt;style type="text/css"&
复制链接

扫一扫