CSS3——弹性盒模型-flex——等分布局、流式布局、圣杯布局(推荐阅读很棒)_弹性盒子等分

作者：我家小花儿 | 2024-03-15 14:47:21

踩

弹性盒子等分

1.等分布局：

中间固定两边自适应：

固定两个，一个自适应

2.流式布局：

模仿float浮动布局

3.圣杯布局：（自适应布局）

先来看一下结构布局：

复制代码

    <div class="wrapper">
        <div class="headr">导航栏，头部，搜索框</div>
        <div class="contain">
            <div class="left">物品分类</div>
            <div class="center">广告内容</div>
            <div class="right">登录</div>
        </div>
        <div class="footer">尾部</div>
    </div>

复制代码

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/我家小花儿/article/detail/241920

CSS3——弹性盒模型-flex——等分布局、流式布局、圣杯布局(推荐阅读 很棒)_弹性盒子 等分

CSS3——弹性盒模型-flex——等分布局、流式布局、圣杯布局(推荐阅读很棒)_弹性盒子等分