0

我已经加载了这个 CSS：

#ue_email_new{
  border:  1px solid #000000;
}

它在页面加载时准确显示。

但是，在单击检查元素（FF 17）并查看 CSS 后，我在调试器中看到了以下信息：

element {
    border: 1px solid rgb(221, 221, 221);
}

并且边框在实际页面上更改为这个奇怪的设置。

这个是从哪里来的？

我检查了我的 CSS 并找不到这些设置。究竟是什么

element

调试器所指的标记？

HTML 看起来像这样：

<div id="wr_ue_email_new">
  <input autocomplete="off" class="radius_all" name="email" id="ue_email_new" type="text" maxlength="320" />
  <p id="ue_email_lab" class="ue_lab_new">Email</p>
</div>
4

2 回答 2

1

element关键字用于指示元素的内联样式。这就是为什么它会覆盖样式表中设置的 CSS。

所以在 Firefox 检查器中的 CSS：

element {
    border: 1px solid rgb(221, 221, 221);
}

意味着您呈现的 html 是这样的：

<input style="border: 1px solid rgb(221, 221, 221);" autocomplete="off" class="radius_all" name="email" id="ue_email_new" type="text" maxlength="320" />

因此，首先检查您的源 html 以确保您没有任何内联样式，然后检查是否没有 JavaScript 添加内联样式。

于 2013-05-26T20:06:43.687 回答
1

您看到的element { .... }代码似乎是 Firebug 报告当前元素的内联样式。（我在这里使用的当前版本的 Firefox/Firebugelement.style {...}不是element，Chrome 也是，但我仍然认为这就是它的样子）

我怀疑你看到的是一些被触发的 Javascript 事件。可能是一个mouseover事件或类似事件，该事件正在设置元素的 CSS 边框。

当您使用 Firebug 选择一个元素时，它会在您找到所需的元素并选择它时暂停页面的正常事件处理。但是，一旦您选择了元素，页面就会恢复正常并触发事件。

我的猜测是此时会立即触发相关事件。运行事件的 Javascript 代码，并设置 CSS 边框。这似乎是 Firebug 对样式进行更改，但事实并非如此；只是您的事件处理代码做了一些意想不到的事情。

这也解释了为什么您在 CSS 中找不到代码——因为它在您的 JS 代码中。

我会尝试在您的 JS 代码中搜索有问题的颜色（正如@adaam 所说，等效的十六进制值是#DDDDDD，尽管它也可能是#DDD）。

于 2013-05-26T20:13:30.887 回答