在容器样式中使用 `display : "flex" 时需要哪些必要的参数？` [重复]

Question

我是 React 新手，正如标题所示，我的问题是“显示中的 Flex 是什么：React 中的“Flex”？”

在阅读多个文档时，它说它是用于 Flexbox 的，根据我的理解，这是用于布局组件的，但这让我更加困惑。我假设在这种情况下，如果我理解正确的话，Flexbox 将使用高度和宽度来与其他组件保持距离。

const ColoredCircleIcon = ({ color = 'orange', size = 50 }: ColoredCircleIconProps): JSX.Element => {

  const containerStyles: React.CSSProperties = {
    display: 'flex',
    alignItems: 'center',
    justifyContent: 'center',
    height: '100vh',    // Full viewport height
    width: '100vw',     // Full viewport width
  };

  return (
    <div style={containerStyles}>
      <FaCircle color={color} size={size} /> {/* Circle Icon */}
    </div>
  );
};

在 react 文档中，它显示了代码示例，但没有任何

display : "flex"

这也引出了一个问题，Flexbox 算法需要哪些参数？如何找到参数列表？

Answer 1

https://www.w3schools.com/css/css3_flexbox.asp

找到它们的宝库