在 Tailwind CSS 中，我们可以通过众多的类来控制元素的高度，这些类涵盖了所有的 CSS 高度属性。这实际上是对 CSS height 属性 的一种便捷替代。我们可以使用这些类来设置元素的高度，需要注意的是，高度类指的是元素内容区域的高度，不包含内边距、外边距和边框。

#### 高度类概览：

• h-0: 我们将使用这个类将高度设置为零。
• h-auto: 这个类让浏览器根据内容自动设置高度。
• h-px: 我们可以使用这个类将高度固定为 1px。
• h-1/2: 这个类将高度设置为视口高度的一半。
• h-1/3: 这个类将高度设置为视口高度的三分之一。
• h-1/4: 这个类将高度设置为视口高度的四分之一。
• h-1/5: 这个类将高度设置为视口高度的五分之一。
• h-1/6: 这个类将高度设置为视口高度的六分之一。
• h-full: 只要父元素定义了高度，这个类就会将元素的高度设置为父元素的 100%。
• h-screen: 这个类用于让元素跨越视口的整个高度。

注意：我们可以将其中的数字替换为有效的 "rem" 值，或者直接使用百分比值。

#### h-0:

我们可以使用这个类为任何元素设置特定的高度。我们可以将其中的数字替换为有效的 rem 单位数值，从而固定元素的高度。

语法：

...

示例：

HTML


“

<link href=

"https://unpkg.com/[email protected]/dist/tailwind.min.css"

rel="stylesheet">

GeeksforGeeks

Tailwind CSS Height Class
<div class="flex flex-wrap-reverse p-4 mx-12

space-x-4 h-64 bg-green-200">

<div class="h-8 w-12 bg-green-400

rounded-lg">h-8