如何设计一个三个DIV互相适应的HTML结构

问题描述

我们项目目前有一个页面,他的结构是这样的

clipboard.png
现在有一个需求,需要在这个结构下和下面这个结构互相切换。

clipboard.png

问题出现的环境背景及自己尝试过哪些方法

我目前的想法是在最底下多加一个重复的div,然后用ngIf去控制他的显示,其余部分使用flex来填满。

clipboard.png

但是有没有更简单的单纯通过css和html结构来调整使得两个结构可以简单的互相切换。

阅读 1.9k
2 个回答

这种布局很适合用 grid 布局来做,切换时只用控制 css 就行了。

子div左边flex:1,右边写固定宽度px
flex占满也许是个不错的解决方式.

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题