调整大小

调整大小

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

类样式

resize-none

resize: none;

调整大小

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>

前缀a resize 实用工具使用像 md: 这样的断点变体，仅在中等屏幕尺寸及以上应用该实用工具

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

了解有关在变体文档中使用变体的更多信息。