这是显示的正确用法：flex？

Question

这是一个正确的用例吗？

显示：在<ul>上展示，然后每个<li>都有基于像素或百分比的宽度。

我想使用它的主要原因是我可以使用align-items: center（垂直对齐）。

它似乎工作得很好，我无法让它与其他任何东西很好地协同工作，但感觉不对，因为我实际上并没有在列表项上使用任何flex值。

Answer 1

是的，这种用法完全有效。它只是意味着所有孩子都得到了他们的默认行为，即flex: 0 1 auto（语法为flex: <flex-grow> <flex-shrink> <flex-basis>）。而这恰好是你想要的，这只是恰当地对齐所有项目。您不希望任何项目增长（flex-grow: 0），如果需要，它们应缩小到相同的大小（flex-shrink: 1），并且您希望它们根据内容进行布局（{{1} }）。

我建议您浏览以下页面，因为它非常清楚地解释了这一点：https://css-tricks.com/snippets/css/a-guide-to-flexbox/

它解释了所有属性，包含必要时最重要的W3资源的示例和链接，例如flex-basis: auto的{​​{3}}。