1

我有一个带有所需文件的简单 HTML5 表单。当页面加载时，字段没有样式。当我单击必填字段时，输入一些内容，然后删除我刚刚输入的文本并退出该字段，它会在 Firefox 中的无效字段之外显示粉红色的框阴影。

现在我需要黄色框阴影，同时保持相同的行为。我就是这样做的：

在 HTML 中

<input name="email_address" id="email_address_uuid_479823574" type="email"
       placeholder="ex. example@domain.com" title="Email address" required />

       -------
       -------

<input name="model_number" id="model_number_uuid_479823574" type="text"
       placeholder="ex. oxpd-983s" title="Equipment model number" required />

在 CSS 中

input:required:invalid {box-shadow: 1px 2px 9px yellow};

结果：页面加载了所有带有黄色框阴影的字段！而是等待用户像默认行为一样在 onblur 和 onsubmit 上犯错误。

如何在不改变行为的情况下覆盖无效字段的默认框阴影？

4

1 回答 1

0

尝试：

input:required:-moz-ui-invalid {box-shadow: 1px 2px 9px yellow};

见https://developer.mozilla.org/en/CSS/:invalid

于 2012-07-05T16:34:20.360 回答