CSS 赋予了页面活力。多年来，CSS 变得越来越强大，并且已经开始用于制作以前需要 JavaScript 的动画。本周我一直在研究它的一些更高级的属性。
媒体查询几乎已经成为新时代设备的必需品。随着智能手机的出现，通过手机消费媒体的人比任何其他设备都多。因此，网站不仅需要在移动设备上看起来不错，而且在大尺寸屏幕上也有良好的呈现效果。我们该如何做到这一点？嗯，部分......
当将媒体查询与 Flexbox 相结合时，CSS 成为工具箱的强大工具。 （几乎是一种类似 UNIX 的哲学，将小工具组合成一个大工具）现在我们可以做一些非常酷的事情。
实际上，Flexbox 将根据您设置的 Flexbox 规则来处理框中的第一个子元素：
.flexbox {
/* Turns on flexbox */
display: flex;
/* How would you like stuff displayed? Rows, columns... maybe display the items in reverse order?*/
flex-direction: row;
/* How do you want to spacing between your items to work? */
justify-content: flex-end;
/* How do you want items arranged on the main axis? */
align-items: center;
/*And so on...*/
}
这是我第一次真正尝试使用 Flexbox，因此我提供了一些材料，这些材料可以为您提供比我上面的简短解释更完整的信息。其中的内容远比我在这里所能涵盖的更多。
MDN：使用媒体查询
MDN：Flexbox
CSS 技巧：Flexbox 指南
查看：https://flexboxfroggy.com
另：https://mastery.games/post/flexboxzombies2/
现在您可以真正使用 Flexbox 了！
现在我们进入有趣的部分了。有了我学到的一些基本工具，现在我要开始制作作品集了。作品集是向雇主和其他人展示您一直在做什么的一种方式。我预计随着我的继续，这种情况会改变很多次。但首先，让我们看看是否能让作品集看起来不错！ CSS 会帮助我做到这一点。推动并看看我能用它做什么应该很有趣。我预计会遇到一些障碍，甚至可能需要在下一步写作时纠正一些理解，所以我不会将其视为 CSS 和 Flexbox 的明确看法。
需要一些 Lorem Ipsum 占位符吗？为什么不加点香料呢！
对于 VSCode 用户，一些扩展：
以上是CSS 太棒了！的详细内容。更多信息请关注PHP中文网其他相关文章！
