resize

resize

用於控制元素如何調整大小的工具。

類別樣式

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>

前綴a resize 实用程序與像 md: 這樣的斷點變體結合使用，僅在中等螢幕尺寸及以上套用該實用程序

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

了解更多關於在變體文檔中使用變體的信息。