如何制作两个午夜指挥官，例如BS5 / Angular 13中的布局

发布于 2025-02-09 10:13:34 字数 227 浏览 2 评论 0原文

我想为我的组件实现以下布局：

|-----------|
-------------
|     |     |
|     |     |
|     |     |
|     |     |
-------------

工具箱，顶部有按钮和两个固定尺寸的面板，并带有边框和滚动左下方。

我应该在Flex工具上进行一些研究，还是简单的样式表可以解决我的案例？

原文

I'd like to achieve the following layout for my component:

|-----------|
-------------
|     |     |
|     |     |
|     |     |
|     |     |
-------------

Toolbox with buttons on the top and two fixed sized panels with borders and scrolls bottom left and right.

Should I do some research in flex tools, or simple stylesheet would solve my case?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

末蓝 2025-02-16 10:13:34

对于视觉构建器，您可以使用 http://shoelace.io/ 用于balout and bootstrap elements for Toolbar

此代码可以粘贴到shoelace。

<div class="container">
    <div class="row">
        <div class="col-sm-12"></div>
    </div>
    <div class="row">
        <div class="col-sm-6"></div>
        <div class="col-sm-6"></div>
    </div>
</div>

For a visual builder you could use http://shoelace.io/ for the layout and other bootstrap elements for the toolbar https://mdbootstrap.com/docs/b5/angular/navigation/navbar/

This code can be pasted to shoelace.

<div class="container">
    <div class="row">
        <div class="col-sm-12"></div>
    </div>
    <div class="row">
        <div class="col-sm-6"></div>
        <div class="col-sm-6"></div>
    </div>
</div>