HTML/CSS(关于等高布局)

最新推荐文章于 2021-06-02 14:02:30 发布

明日份可乐

最新推荐文章于 2021-06-02 14:02:30 发布

阅读量372

点赞数

分类专栏： HTML/CSS

本文链接：https://blog.csdn.net/ron_wang_/article/details/99358643

版权

HTML/CSS 专栏收录该内容

14 篇文章 1 订阅

订阅专栏

<style>
        * {
            margin: 0;
            padding: 0;
        }

        .box {
            overflow: hidden;
            /* 给父级设置flex就不用让左右元素都浮动了 */
            display: flex;
        }

        .left {
            width: 50%;
            background-color: aquamarine;
            /* padding-bottom: 500px 会让三个盒子拉伸 */
            padding-bottom: 500px;
            /* 然后利用 margin-bottom: -500px 将拉伸了的padding切割 500px */
            margin-bottom: -500px;
        }

        .right {
            width: 50%;
            background-color: cadetblue;
            padding-bottom: 500px;
            margin-bottom: -500px;
        }
    </style>

		<!-- //元素的高度被文字撑开 并且两边高度始终一致 -->
    <div class="box">
        <div class="left">
            大家好我是联系时长两年半的蔡徐坤<br>
            大家好我是联系时长两年半的蔡徐坤<br>
            大家好我是联系时长两年半的蔡徐坤<br>
            大家好我是联系时长两年半的蔡徐坤<br>
            大家好我是联系时长两年半的蔡徐坤<br>
            大家好我是联系时长两年半的蔡徐坤<br>
            大家好我是联系时长两年半的蔡徐坤<br>
            大家好我是联系时长两年半的蔡徐坤<br>
            大家好我是联系时长两年半的蔡徐坤<br>
            大家好我是联系时长两年半的蔡徐坤<br>
            大家好我是联系时长两年半的蔡徐坤<br>
            大家好我是联系时长两年半的蔡徐坤<br>
            大家好我是联系时长两年半的蔡徐坤<br>
            大家好我是联系时长两年半的蔡徐坤<br>
            大家好我是联系时长两年半的蔡徐坤<br>
            大家好我是联系时长两年半的蔡徐坤<br>
            大家好我是联系时长两年半的蔡徐坤<br>
            大家好我是联系时长两年半的蔡徐坤<br>
            大家好我是联系时长两年半的蔡徐坤<br>
            大家好我是联系时长两年半的蔡徐坤<br>
            大家好我是联系时长两年半的蔡徐坤<br>
            大家好我是联系时长两年半的蔡徐坤<br>
            大家好我是联系时长两年半的蔡徐坤<br>
            大家好我是联系时长两年半的蔡徐坤<br>
            大家好我是联系时长两年半的蔡徐坤<br>
            大家好我是联系时长两年半的蔡徐坤<br>
            大家好我是联系时长两年半的蔡徐坤<br>
            大家好我是联系时长两年半的蔡徐坤<br>
            大家好我是联系时长两年半的蔡徐坤<br>
        </div>
        <div class="right">
            我喜欢唱跳rap 篮球<br>
            我喜欢唱跳rap 篮球<br>
            我喜欢唱跳rap 篮球<br>
            我喜欢唱跳rap 篮球<br>
            我喜欢唱跳rap 篮球<br>
            我喜欢唱跳rap 篮球<br>
            我喜欢唱跳rap 篮球<br>
            我喜欢唱跳rap 篮球<br>
            我喜欢唱跳rap 篮球<br>
            我喜欢唱跳rap 篮球<br>
            我喜欢唱跳rap 篮球<br>
            我喜欢唱跳rap 篮球<br>
            我喜欢唱跳rap 篮球<br>
        </div>
    </div>