Ionic 如何得到一个像这样的布局？比使用离子网格更好的方法？

r1wp621o 于 2022-12-16 发布在 Ionic

关注(0)|答案(1)|浏览(125)

我试图得到一个css布局像下面的一个。它将包括6个div总数... 3在顶部和3在底部。我希望他们是静态的大小，所以他们不会改变高度/宽度。我正在使用Angular /离子，并试图使用离子网格，但不能得到间距看起来正确使用网格系统。我用一个指令/组件，但可以处理该部分周围的CSS。

ionic-framework

来源：https://stackoverflow.com/questions/73167118/how-to-get-a-layout-of-divs-that-looks-like-this-better-way-than-trying-to-use

1条答案

按热度按时间

vddsk6oq1#

使用Flexbox轻松操作

.d-flex {
    display: flex ;
    height: 200px;
    &.short {
        height: 40px;
    }
    div {
        flex: 1 1 0 ;
        border: solid 1px black ;
        &.small {
            flex-grow: 0;
            min-width: 50px;
        }
    }
}

<div class="d-flex">
        <div class=""></div>
        <div class="small"></div>
        <div class=""></div>
    </div>
    <div class="d-flex short">
        <div class=""></div>
        <div class="small"></div>
        <div class=""></div>
    </div>

赞(0）回复(0）举报 2022-12-16

我来回答

Ionic 如何得到一个像这样的布局？比使用离子网格更好的方法？

1条答案

相关问题

热门标签

最新问答