reactjs - 网格还是 Flexbox？如果使用 react-semantic-ui

Question

目前我正在铺设我的网页的基础(这也是移动优先)，我有一个论点。我在我的 React 项目中添加了 react-semantic-ui。



添加的是我的目标布局。现在我应该用什么来绘制这个，Grid或 Flexbox ?
我应该避免使用 Grid ?它会减慢渲染速度还是降低性能？或者我应该使用 flexbox在最大的地方？或者它应该始终使用 Grid或 flexbox ?或者它可能是两者的结合。
请指导我。

提前致谢!

Answer 1

CSS-grid 非常适合构建宽布局。它甚至可以帮助创建非对称项目。

Flexbox 非常适合对齐元素内的内容。使用 flex 放置项目的小细节。

将 CSS 网格用于 2D 布局(行和列)

Flexbox 仅在一维(行或列)上效果更好

没有理由只使用其中之一。研究它们并一起使用。