【问题标题】:Using TailwindCSS Forms with Blazor EditForm doesn't remove styling on InputText将 TailwindCSS 表单与 Blazor EditForm 一起使用不会删除 InputText 上的样式
【发布时间】:2021-02-02 16:36:18
【问题描述】:
使用Tailwind forms 时,我希望我的<InputText /> 元素没有样式,但它保留了文本输入的原始样式。
如果我做类似
<input type="text" name="client_name" id="client_name" class="block w-full sm:text-sm border-gray-300 rounded-md">
在使用 TailwindCSS-forms 时,如何取消 <InputText /> 的内置样式?
【问题讨论】:
标签:
blazor
tailwind-css
blazor-editform
【解决方案1】:
您需要添加type="text"。
所以你会想要这样的东西:
<InputText type="text" id="client_name" @bind-Value="client.Name" class="block w-full sm:text-sm border-gray-300 rounded-md"/>
@tailwindcss/forms 文档在下面解释了原因:
请注意,对于文本输入,您必须添加 type="text" 属性才能使这些样式生效。这是一个必要的权衡,以避免依赖过于贪婪的输入选择器和我们还没有解决方案的无意样式元素,例如 input[type="range"]。