
# 表单插件

`@tailwindcss/forms` 是官方表单插件的 1:1 PHP 移植版。它为表单控件提供了一套固定的重置样式——文本输入框、文本区域、选择框、复选框和单选按钮——让它们拥有统一的基准样式（重置外观、边框、内边距、焦点环、自定义选择箭头以及复选框/单选按钮图标），之后你可以用工具类覆盖这些样式。

## 用法

使用 `@plugin` 加载插件，并导入工具层：

```php
use TailwindPHP\tw;

$css = tw::generate(
    '<input class="form-input"><select class="form-select"></select>',
    '@plugin "@tailwindcss/forms"; @import "tailwindcss/utilities.css";'
);
```

## 策略

`strategy` 选项控制样式的应用方式：

| 策略 | 行为 |
|----------|----------|
| `base` | 通过 `[type='text']`、`textarea` 和 `select` 等选择器，为原生表单元素全局设置样式。 |
| `class` | 仅为明确指定的 `form-*` 类设置样式，不影响未添加类的元素。 |

省略 `strategy` 时，会同时应用**两种**策略——原生元素会获得基准重置样式，也可以使用 `form-*` 类。设置单一策略即可禁用另一种：

```css
@plugin "@tailwindcss/forms" {
    strategy: "class";
}
```

## 类策略

采用 `class` 策略（或使用默认设置）时，可将以下类显式应用到要设置样式的元素：

| 类 | 元素 |
|-------|---------|
| `form-input` | 类似文本框的输入元素 |
| `form-textarea` | `<textarea>` |
| `form-select` | `<select>` |
| `form-multiselect` | `<select multiple>` |
| `form-checkbox` | `<input type="checkbox">` |
| `form-radio` | `<input type="radio">` |

```php
$css = tw::generate(
    '
        <input class="form-input">
        <textarea class="form-textarea"></textarea>
        <select class="form-select"></select>
        <select class="form-multiselect" multiple></select>
        <input type="checkbox" class="form-checkbox">
        <input type="radio" class="form-radio">
    ',
    '
        @plugin "@tailwindcss/forms" {
            strategy: "class";
        }
        @import "tailwindcss/utilities.css";
    '
);
```

每个类都会重置控件外观，并设置边框、内边距和焦点环；`form-select` 会添加箭头背景图，`form-checkbox`/`form-radio` 会添加选中状态图标。可使用常规工具类覆盖这些设置（例如 `class="form-input rounded-lg border-gray-300"`）。

有关 `@plugin` 指令和加载详情，请参阅[插件](https://tailwindphp.inline0.dev/zh/docs/plugins)。
