html5+css 三列布局

最新推荐文章于 2024-02-05 14:39:35 发布

景上

最新推荐文章于 2024-02-05 14:39:35 发布

阅读量3.1k

点赞数 1

分类专栏： h5+css 文章标签： html5 布局

本文链接：https://blog.csdn.net/baidu_32731497/article/details/51864388

版权

h5+css 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title>三列布局</title>
    <style type="text/css">
        body{
            margin:0;
            padding:0;
        }
        .left{
            width:188px;
            height:200px;
            background:red;
            position:absolute;
            left:0;
            top:0;
        }
        .right{
            width:200px;
            height:260px;
            background:blue;
            position:absolute;
            right:0;
            top:0;
        }
        .mid{
            height:220px;      /*此处不设置宽度，当缩小宽度时，内容会自动换行；*/
            background:purple;
            margin:0 200px 0 188px;
        }
    </style>
</head>
<body>
    <div class="left"></div>
    <div class="mid">gdfgdgggggggggggggggggggggghfg打得过烦得很gggggggggg</div>
    <div class="right"></div>
</body>
</html>

这里写图片描述

优惠劵

景上

关注关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
html5+css 三列布局

<!DOCTYPE html><html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> <meta charset="utf-8" /> <title>三列布局</title> <style type="text/css"> body{ margin:0;
复制链接

扫一扫