使用TailwindCSS从Django表单中删除焦点环和边框

lawou6xi  于 2023-10-21  发布在  Go
关注(0)|答案(3)|浏览(175)

**目标:**Django表单中没有边框或焦点环。
**当前:**我目前只能更改某些属性,如文本颜色和圆角,但不能更改边框或焦点。我使用django-widget-tweaks来为表单分配类属性。我使用django-tailwindcss在Django中使用顺风。
**尝试:**我正在使用顺风ring-0border-0顺风属性,但它们根本不起作用。
验证码:

{% load widget_tweaks %}

<form action="{% url 'marketing:subscribe' %}" method="post">
    {% csrf_token %}
    {{ form.email|add_class:"bg-black rounded-lg border-0 ring-0 focus:ring-0" }}
    <button class="text-green-300" type="submit">Subscribe</button>
</form>
mqxuamgl

mqxuamgl1#

尝试添加类“focus:outline-none”。至少可以用按钮

cuxqih21

cuxqih212#

如果你在你的代码中使用tailwind组件,那么这就可以了。
className=“focus:ring-offset-0”

bkkx9g8r

bkkx9g8r3#

要删除边界,请在顺风中使用outline-none。
我就是这么做的

class Meta:
    widgets = {
        'email': forms.TextInput(attrs={
            'placeholder': '[email protected]',
            'class': 'p-6 border-none',
            }),
    }

相关问题