【无标题】

最新推荐文章于 2024-09-13 13:42:49 发布

xin_yan1

最新推荐文章于 2024-09-13 13:42:49 发布

阅读量189

点赞数

本文链接：https://blog.csdn.net/xin_yan1/article/details/124155866

版权

编辑器

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <style>
   * {
            margin: 0;
            padding: 0;
        }
        .header,.footer {
            height: 100px;
            background: #000;
            color:mediumvioletred;
        }
        .main {
            height: 400px;
            background: #ccc;
        }
        .center {
            height: 400px;
            background: skyblue;
            float: left;
            width: 100%;
        }
        .left {
            width: 300px;
            height: 400px;
            background: greenyellow;
            float: left;
            margin-left: -100%;
        }
        .right {
            width: 300px;
            height: 400px;
            background: palevioletred;
            float: left;
            margin-left: -300px;
        }
    </style>
</head>
<body>
     <header>header</header>
     <div class="flex-box" >
        <div class="left">@yield('left')</div>
        <div class="center">@yield('text')</div>

        <div class="right">@yield('right')</div>
     </div>
     <footer>footer</footer>
</body>
</html>

在这里插入图片描述