当我使用 tailwind CSS 时，h1 文本如何变小？

Question

我目前正在开发一个学习 React 和 Node.js 的网站。当我需要 CSS 时，我听说了 tailwind CSS，这是一个非常好的 CSS 集合。我决定在我的 React 项目中使用 Tailwind。我按照 Tailwind网站上所说的 create-react-app的步骤进行操作。

之后，当我尝试使用 h1 标签的 Hello World 项目时，文本大小太小。

这怎么发生的？这是因为顺风还是因为我的错？有哪些方法可以解决这个问题？？这是我第一次顺风。

我的代码：JS：

function App() {
  return (
   <div className="App">
    <h1 className="text-center text-green-900 font-bold "  >Hello World</h1>
  </div>
  );
 }

export default App;

索引.css：

@tailwind base;
@tailwind components;
@tailwind utilities;

tailwind.config.js：

module.exports = {
content: [
"./src/**/*.{js,jsx,ts,tsx}",
],
theme: {
extend: {},
},
plugins: [],
}

Answer 1

Tailwind，将-标签设置font-size为。inherith1h6

有关“默认值”，请参阅基本样式。

因此，您必须给他们一个尺码类别，以将其设置为您想要的。