标签
标签用于为输入字段提供名称或标题。标签可以放在字段之前或之后。
| 类名 | 类型 | |
|---|---|---|
| 标签 | 组件 | 用于样式化输入字段（或选择框）旁边的文本 |
| 浮动标签 | 组件 | 用于输入字段（或选择框）的父元素和一个 span，该 span 在字段获得焦点时浮动在输入字段上方 |
<label class="$$input"> <span class="$$label">https://</span> <input type="text" placeholder="URL" /> </label>
<label class="$$input">
<span class="$$label">https://</span>
<input type="text" placeholder="URL" />
</label>
<label class="$$input">
<span class="$$label">https://</span>
<input type="text" placeholder="URL" />
</label>
<label class="$$input">
<span class="$$label">https://</span>
<input type="text" placeholder="URL" />
</label><label class="$$input"> <input type="text" placeholder="domain name" /> <span class="$$label">.com</span> </label>
<label class="$$input">
<input type="text" placeholder="domain name" />
<span class="$$label">.com</span>
</label>
<label class="$$input">
<input type="text" placeholder="domain name" />
<span class="$$label">.com</span>
</label>
<label class="$$input">
<input type="text" placeholder="domain name" />
<span class="$$label">.com</span>
</label><label class="$$select"> <span class="$$label">Type</span> <select> <option>Personal</option> <option>Business</option> </select> </label>
<label class="$$select">
<span class="$$label">Type</span>
<select>
<option>Personal</option>
<option>Business</option>
</select>
</label>
<label class="$$select">
<span class="$$label">Type</span>
<select>
<option>Personal</option>
<option>Business</option>
</select>
</label>
<label class="$$select">
<span class="$$label">Type</span>
<select>
<option>Personal</option>
<option>Business</option>
</select>
</label><label class="$$input"> <span class="$$label">Publish date</span> <input type="date" /> </label>
<label class="$$input">
<span class="$$label">Publish date</span>
<input type="date" />
</label>
<label class="$$input">
<span class="$$label">Publish date</span>
<input type="date" />
</label>
<label class="$$input">
<span class="$$label">Publish date</span>
<input type="date" />
</label><label class="$$floating-label"> <span>Your Email</span> <input type="text" placeholder="mail@site.com" class="$$input $$input-md" /> </label>
<label class="$$floating-label">
<span>Your Email</span>
<input type="text" placeholder="mail@site.com" class="$$input $$input-md" />
</label>
<label class="$$floating-label">
<span>Your Email</span>
<input type="text" placeholder="mail@site.com" class="$$input $$input-md" />
</label>
<label class="$$floating-label">
<span>Your Email</span>
<input type="text" placeholder="mail@site.com" class="$$input $$input-md" />
</label><label class="$$floating-label"> <input type="text" placeholder="Extra Small" class="$$input $$input-xs" /> <span>Extra Small</span> </label> <label class="$$floating-label"> <input type="text" placeholder="Small" class="$$input $$input-sm" /> <span>Small</span> </label> <label class="$$floating-label"> <input type="text" placeholder="Medium" class="$$input $$input-md" /> <span>Medium</span> </label> <label class="$$floating-label"> <input type="text" placeholder="Large" class="$$input $$input-lg" /> <span>Large</span> </label> <label class="$$floating-label"> <input type="text" placeholder="Extra Large" class="$$input $$input-xl" /> <span>Extra Large</span> </label>
<label class="$$floating-label">
<input type="text" placeholder="Extra Small" class="$$input $$input-xs" />
<span>Extra Small</span>
</label>
<label class="$$floating-label">
<input type="text" placeholder="Small" class="$$input $$input-sm" />
<span>Small</span>
</label>
<label class="$$floating-label">
<input type="text" placeholder="Medium" class="$$input $$input-md" />
<span>Medium</span>
</label>
<label class="$$floating-label">
<input type="text" placeholder="Large" class="$$input $$input-lg" />
<span>Large</span>
</label>
<label class="$$floating-label">
<input type="text" placeholder="Extra Large" class="$$input $$input-xl" />
<span>Extra Large</span>
</label>
<label class="$$floating-label">
<input type="text" placeholder="Extra Small" class="$$input $$input-xs" />
<span>Extra Small</span>
</label>
<label class="$$floating-label">
<input type="text" placeholder="Small" class="$$input $$input-sm" />
<span>Small</span>
</label>
<label class="$$floating-label">
<input type="text" placeholder="Medium" class="$$input $$input-md" />
<span>Medium</span>
</label>
<label class="$$floating-label">
<input type="text" placeholder="Large" class="$$input $$input-lg" />
<span>Large</span>
</label>
<label class="$$floating-label">
<input type="text" placeholder="Extra Large" class="$$input $$input-xl" />
<span>Extra Large</span>
</label>
<label class="$$floating-label">
<input type="text" placeholder="Extra Small" class="$$input $$input-xs" />
<span>Extra Small</span>
</label>
<label class="$$floating-label">
<input type="text" placeholder="Small" class="$$input $$input-sm" />
<span>Small</span>
</label>
<label class="$$floating-label">
<input type="text" placeholder="Medium" class="$$input $$input-md" />
<span>Medium</span>
</label>
<label class="$$floating-label">
<input type="text" placeholder="Large" class="$$input $$input-lg" />
<span>Large</span>
</label>
<label class="$$floating-label">
<input type="text" placeholder="Extra Large" class="$$input $$input-xl" />
<span>Extra Large</span>
</label>你有问题吗？ 在 GitHub 上提问 或 Discord 服务器
你发现 bug 了吗？ 在 GitHub 上提交 issue
你喜欢 daisyUI 吗？ 发帖宣传一下吧！
支持 daisyUI 的开发： Open Collective
