CSS布局学习2
flex布局中span会改变行为
在使用 Flex 布局时，盒子中的子元素（如 span）会自动成为 Flex 项目，并参与 Flex 布局的计算。具体原因如下：
Flex 容器：当一个元素设置为 display: flex; 时，它会变成一个 Flex 容器。
Flex 项目：Flex 容器内的所有直接子元素都会自动成为 Flex 项目，无论它们是什么标签（如 div、span 等）。
布局规则：这些 Flex 项目会根据 Flex 布局的规则进行排列和对齐，例如 justify-content、align-items 等属性会影响它们的布局。
因此，即使 span 元素默认是内联元素，一旦它成为 Flex 项目的子元素，就会按照 Flex 布局的规则进行排列。
text-align是设置在父元素中
text-align 属性用于控制文本在其父元素内的水平对齐方式，但它只对块级元素内的内联元素有效。如果你发现 text-align 对 span 元素不生效，可能是因为以下原因：
块级元素：text-align 需要在块级元素上设置，才能影响其内部的内联元素（如 span）。
父元素：确保 text-align 是在 span 的父元素上设置的，而不是在 span 自身上设置。