Lzh on GitHub

field-sizing

用于控制表单控件大小的工具类。

快速参考

类名样式
field-sizing-fixedfield-sizing: fixed;
field-sizing-contentfield-sizing: content;

示例

基于内容调整大小

使用 field-sizing-content 工具类可以让表单控件根据其内容自动调整大小：

在下面的输入框中输入内容以查看大小变化

<textarea class="field-sizing-content ..." rows="2">
  Latex Salesman, Vanderlay Industries
</textarea>

使用固定大小

使用 field-sizing-fixed 工具类可以使表单控件保持固定大小：

在下面的输入框中输入内容以查看大小保持不变

<textarea class="field-sizing-fixed w-80 ..." rows="2">
  Latex Salesman, Vanderlay Industries
</textarea>

响应式设计

在 field-sizing 工具类前加上 md: 等断点变体，使其仅在中等屏幕尺寸及以上应用：

<input class="field-sizing-content md:field-sizing-fixed ..." />

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