无法找到哪个 css 样式应用于元素
Cannot find which css style is being applied to an element
在下面的屏幕截图中，一些 css 样式（红色边框）被应用于输入字段以指示错误。但是我无法弄清楚它是哪个 css 选择器，Firebug 不显示正在应用的任何样式。
演示：
抱歉，该页面没有直接 URL，您可以通过以下方式查看：
- 转到这里：https://wordpress.org/themes/imgwize/
- 单击 "Preview" 按钮。
- 向下滚动页面并单击第一个 post "Hello world"。你可以在那里看到评论表。
- 将字段留空并单击 Post 评论按钮。
这是 Firefox 浏览器的内置 HTML5 原生验证样式。这是通过应用 required="required" HTML5 标签来完成的。您可以通过应用 :invalid CSS 伪元素来删除此样式。
textarea:invalid,
input:invalid {
box-shadow: none;
}
如果您在其他浏览器上执行相同操作，例如 Chrome，您将看到该表单的行为与在 FireFox 中不同。这表明这是一个浏览器功能。我猜你注意到表单输入都有 required 属性，这可能决定了当留空时浏览器的响应。
在下面的屏幕截图中，一些 css 样式（红色边框）被应用于输入字段以指示错误。但是我无法弄清楚它是哪个 css 选择器，Firebug 不显示正在应用的任何样式。
演示： 抱歉，该页面没有直接 URL，您可以通过以下方式查看：
- 转到这里：https://wordpress.org/themes/imgwize/
- 单击 "Preview" 按钮。
- 向下滚动页面并单击第一个 post "Hello world"。你可以在那里看到评论表。
- 将字段留空并单击 Post 评论按钮。
这是 Firefox 浏览器的内置 HTML5 原生验证样式。这是通过应用 required="required" HTML5 标签来完成的。您可以通过应用 :invalid CSS 伪元素来删除此样式。
textarea:invalid,
input:invalid {
box-shadow: none;
}
如果您在其他浏览器上执行相同操作，例如 Chrome，您将看到该表单的行为与在 FireFox 中不同。这表明这是一个浏览器功能。我猜你注意到表单输入都有 required 属性，这可能决定了当留空时浏览器的响应。