是否存在与“flex-grow”属性（或“flex”）相关的交叉轴，它仅影响主轴？

Question

在Flexbox中，有“主轴”和“交叉轴”的概念。通常在浏览器中，“主轴”是水平的，大概是因为台式机和笔记本电脑的屏幕通常是横向的，而在React Native中，“主轴”通常是垂直的，因为它主要用于手机，纵向。无论哪一个是“主轴”，另一个则被称为“交叉轴”。

似乎在Flexbox中，影响主轴的许多属性都有一个影响交叉轴的不同名称。

有一个名为flex-grow的房产，另一个叫做flex，可以同时完成flex-grow和其他一些工作。

我不清楚这个flex-grow是否是具有对应物的属性之一，或者是否是例外。 flex属性也是如此。

我要求的一个原因是我经常读到，当试图让您的布局正确时，您可以在线阅读，您可能需要为您的元素及其所有计数/父元素设置flex至1。但是你的布局中的哪些地方需要达到相同的目标，但是在交叉轴上呢？

Answer 1

的flex-grow（和速记flex）属性总是影响主轴线，具有没有对应，并设置如何水平分布的*空间为挠曲行方向和垂直方向为柔性列方向 。

相比较而言，例如justify-content属性会影响主轴线，具有一个对应，而影响横轴，其中两个设置在柔性件的对准的align-items。

虽然这里可能会引起混淆，但是基于流向，它们会影响柔性项目的水平或垂直。

---

注意，主要和交叉轴无关与屏幕是宽或高。

它做的流动方向，所以对于一个挠曲行方向，这是缺省值，该主轴线是水平的，并且横轴是垂直的，而对于柔性列方向,主轴是垂直的并且交叉轴是水平的。

一篇非常好的文章是A Complete Guide to Flexbox，这更加深入地解释了这一点。