css - 如何将 Grommet 标题组件中的文本大写？

Question

我正在使用grommetReact 项目并想知道如何在几个<Heading />组件中大写文本。

Answer 1

我使用了内联样式。

  <Heading style={{'textTransform': 'capitalize'}}>{product.name}</Heading>

Answer 2

您要求制作 Headercapitalize并做Uppercase.

在您的回答中，您正在这样做，

<Heading style={{'textTransform': 'uppercase'}}>{product.name}</Heading>

假设您的product.name= mobile，然后根据您的答案，您将获得MOBILE所有uppercase字母的输出。

让它capitalize使用这个

<Heading style={{'textTransform': 'capitalize'}}>{product.name}</Heading>

现在你会得到你想要的输出Mobile，这是capitalized一个。

有关更多详细信息uppercase，capitalize请参阅此。