我可以在 Flexbox `` 没有包装器的元素 `` 中垂直对齐文本吗？

Flexbox 内的垂直文本对齐方式

查询

内的垂直文本对齐方式使用 Flexbox 的元素被证明具有挑战性。删除中间包装

是否可行？通常接收align-items:center属性，同时保留动态高度管理的元素？

解决方案

要在Flexbox内垂直对齐文本，请使用align-items: center而不是align-self ： 中心。此修改对齐 Flex 容器内的子元素，在本例中为

。 element.

说明

align-self 属性针对的是 Flex 项目，而align-items 则针对的是 Flex 容器。由于

元素不是 Flex 容器，align-self 对
• 没有影响。元素。相反，align-items 可以用在
• 上。垂直对齐其子元素的元素。