Bootstrap 4和断点

Question

我想在Photoshop中创建一个UI，该UI将用于呈现全角网站。我以前从未使用过Flexbox，也从未在使用前创建过全尺寸网站。

我想知道我是只是坚持默认的引导程序断点，还是需要做一些完全不同的事情。

全角布局类型的示例：

Answer 1

这是一个非常笼统的问题，我为您提供以下建议：

我会同时使用grid和flexbox，因为网格非常适合构建更大的图片，并且非常容易管理页面的整体布局。他们还能够处理更多非传统和不对称的设计。

Flexbox非常适合在元素内部对齐内容，因此您可以使用flexboxes定位设计的较小细节。

您可以将CSS网格用于2D布局（行和列），而将Flexbox仅用于一维（行或列）。

没有理由只使用CSS网格或仅使用flexbox-它们在各自的使用领域可以很好地协同工作。

对于布局和截屏视频，我可以明确推荐Adobe XD-在Adobe系列中非常新鲜，并且现在免费。

我希望可以给您一些想法，例如如何进行项目并根据需要规划布局。

编辑：

看看this article-它应该使您对如何根据布局和媒体/设备设置断点有一个清晰的了解。