为什么 tailwind CSS 弹性框会这样渲染？

Question

渲染输出

<div className="flex flex-col">
  <div className="w-full">
    <p className="text-7xl">Skills</p>
  </div>
  <div className="flex flex-col md:flex-row">
    <div>
      <p>
        Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorem
        labore consectetur, adipisci dicta illum ratione aperiam recusandae
        perferendis. Corporis nihil commodi in! Pariatur, molestias
        similique officiis ad quis impedit dolore.
      </p>
    </div>
    <div>
      <Orbit items={orbitItems} size="text-4xl" />
    </div>
  </div>
</div>

我期望输出是这样的：

标题

Lorem ipsum ....轨道

Answer 1

className=""

不是html的有效属性，你想要

class=""