flex垂直两端分布

最新推荐文章于 2024-07-16 11:56:08 发布

You are my sunshine....

最新推荐文章于 2024-07-16 11:56:08 发布

阅读量786

点赞数

CC 4.0 BY-SA版权

分类专栏： html_css 小程序

本文链接：https://blog.youkuaiyun.com/weixin_45849330/article/details/114089857

小程序同时被 2 个专栏收录

11 篇文章

订阅专栏

html_css

2 篇文章

订阅专栏

博客围绕Flex两端分布展开，但具体内容缺失。Flex是前端布局常用技术，两端分布可实现元素合理排列，在前端页面设计中有重要应用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<view class="test-box">
            <view class="left-box">left</view>
            <view class="right-box">
                <view class="right-top">right top</view>
                <view class="right-lower">right lower</view>
            </view>
        </view>

.test-box {
    display: flex;
    align-items: center;
    .left-box {
        height: 300rpx;
        background-color: #ddd;
    }
    .right-box {
        display: flex;
        // flex-direction: column;
        flex-wrap: wrap;
        align-content: space-between;
        flex: 1;
        height: 300rpx;
        .right-top {
            width: 100%;
        }
        .right-lower {
            align-self: flex-end;
        }
    }
}