调整大小

调整大小

用于控制元素如何调整大小的工具。

Class Styles

resize-none

resize: none;

resize

resize: both;

resize-y

resize: vertical;

resize-x

resize: horizontal;

示例

使用 resize 使元素在水平和垂直方向上可调整大小：

在演示中拖动文本区域的控件以查看预期行为

<textarea class="resize rounded-md ..."></textarea>

使用 resize-y 使元素在垂直方向上可调整大小：

在演示中拖动文本区域的控件以查看预期行为

<textarea class="resize-y rounded-md ..."></textarea>

使用 resize-x 使元素在水平方向上可调整大小：

在演示中拖动文本区域的控件以查看预期行为

<textarea class="resize-x rounded-md ..."></textarea>

使用 resize-none 防止元素可调整大小：

注意文本区域的控件消失了

<textarea class="resize-none rounded-md"></textarea>

Prefix a resize utility with a breakpoint variant like md: to only apply the utility at medium screen sizes and above:

<div class="resize-none md:resize ...">
  <!-- ... -->
</div>

Learn more about using variants in the variants documentation.