css - 应该在 Firefox 的 userContent.css 中定义什么命名空间？

Question

在Firefox的userChrome.css中，需要定义XUL命名空间:

@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);

在 userContent.css 中，如果除了网站自定义之外还包含 about:addons 自定义，应该定义什么命名空间？

仅指定:

@namespace url(http://www.w3.org/1999/xhtml);

导致 about:addons 自定义未应用。

(请参阅 Why are CSS declarations for about:addons placed in userContent and not userChrome, given that the namespace is XUL? 了解为什么将 about:addons 自定义设置放在 userContent.css 中。)

Answer 1

userContent.css 文件用于可以属于任何命名空间的内容。它最常用于 HTML 和 XUL。此外，Firefox 正在过渡到在代码中使用更多 HTML 命名空间元素，这些元素用于定义其 chrome(即非内容的所有内容)。因此，您需要同时处理 userChrome.css 和 userContent.css 中的 HTML 和 XUL。

鉴于 Firefox Chrome 混合使用 HTML 和 XUL，我发现我经常需要查看元素的源代码或使用 DOM Inspector查看我感兴趣的元素使用了哪个命名空间。

使用 @namespace 有很多方法可以做到这一点指示。如果需要，可以在同一个文件中使用以下两种方法。如果这样做，您将需要注意您定义为当前默认命名空间的内容。

为 HTML 元素定义规则，将默认值更改为 XUL 然后执行 XUL

考虑到这些文件默认使用 HTML 命名空间，我个人所做的只是在使用之前制定我的 HTML 命名空间规则:

/* Set default namespace to XUL. */
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

将默认命名空间设置为 XUL。然后我的所有 XUL 规则都放置在 namespace 更改之后。因此，它看起来像:

/* Put all HTML namespace rules here. */    

/* Set default namespace to XUL. */
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); 

/* Put all XUL namespace rules here. */    

如何组织它取决于您。我这样做是因为我在将默认 namespace 更改为 XUL 后尝试为元素显式使用 HTML namespace 时遇到问题。我发现显式指定每个元素的 namespace 通常不会像我预期的那样起作用，并且在后面很痛苦。因此，我重组了我使用的所有规则，使其完全是 HTML 或 XUL。

或者，定义命名空间前缀，然后在所有元素上使用它们

如果您想通过为每个元素显式指定命名空间来做到这一点，您将需要定义一个命名空间前缀。你可以通过使用类似的东西来做到这一点:

/* set html namespace to http://www.w3.org/1999/xhtml */
@namespace html url("http://www.w3.org/1999/xhtml");
/* set xul namespace to http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul */
@namespace xul url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

然后您可以使用 html| , xul|或 *|为每个元素指定 HTML、XUL 或所有命名空间。

注意:更改默认命名空间后，您可能需要显式处理其他命名空间中的元素(例如 <svg> 、 <math> 等)，这些元素通常会自动处理。