What namespace should be defined in Firefox's userContent.css?

只愿长相守 提交于 2019-12-08 14:00:25

问题


In Firefox's userChrome.css, it is necessary to define the XUL namespace:

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

In userContent.css, what namespace should be defined if about:addons customizations are included in addition to website customizations?

Specifying only:

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

results in the about:addons customizations not getting applied.

(See Why are CSS declarations for about:addons placed in userContent and not userChrome, given that the namespace is XUL? for why about:addons customizations get placed in userContent.css.)


回答1:


The userContent.css file is used for content that can be of any namespace. Most commonly it is used for both HTML and XUL. In addition, Firefox is transitioning to use more HTML namespace elements in the code which is used to define their chrome (i.e. everything that's not content). Thus, you will need to handle both HTML and XUL in both userChrome.css and userContent.css.

Given the mix of HTML and XUL used in Firefox Chrome, I find that I will often need to either look at the source code for the elements or use the DOM Inspector to see which namespace is being used for the elements I'm interested in.

There are many ways to do this with the @namespace directive. The following two approaches can both be used in the same file, if desired. If you do, you will need to pay attention to what you have defined as the current default namespace.

Define rules for HTML elements, change the default to XUL then do XUL

Given that these files, by default, use the HTML namespace, what I, personally, have done is just have my HTML namespace rules prior to using:

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

to set the default namespace to XUL. All of my XUL rules are then placed after the namespace change. Thus, it looks something like:

/* 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. */    

How you organize it is up to you. I do it this way because I encountered issues when trying to explicitly use the HTML namespace for elements after changing the default namespace to XUL. I found that explicitly specifying the namespace per element often did not function as I expected, and was a pain the the rear. Thus, I restructured all of the rules I use to be exclusively either HTML or XUL.

Alternately, define namespace prefixes, then use them on all elements

If you want to do it by explicitly specifying the namespace for each element, you will want to define a namespace prefix. You can do so by using something like:

/* 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");

You can then use html|, xul| or *| to specify the HTML, XUL, or all namespaces for each element.

Note: Once you change the default namespace, you may need to explicitly deal with elements in other namespaces (e.g. <svg>, <math>, etc.), which would normally be handled automatically.



来源:https://stackoverflow.com/questions/44807995/what-namespace-should-be-defined-in-firefoxs-usercontent-css

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!