有人真的使用css命名空间吗？

Question

人们似乎更倾向于使用SMACSS等技术来实现命名空间,而不是实际的css命名空间？

我已经用Google搜索了一下,但我一直无法想出任何好的资源.(这让我担心我的google-fu是废话(非常可能)或者css命名空间规范是无用的(不太可能))

Answer 1

它们涵盖了完全不同的用例.

CSS命名空间用于将CSS应用于混合来自不同XML命名空间的元素的XML文档.例如,你可以瞄准<foo:p>而<bar:p>不会混淆.

SMACSS涵盖了编写健壮的CSS的技术,这些技术不会干扰页面的其他部分.例如,以便.title在您的地址簿中HTML不会混淆.title您的出版物HTML列表.

规格的进一步细节:

注意:在HTML中,xmlns属性绝对没有效果.它基本上是一个护身符.只允许轻松地迁移到XHTML和从XHTML迁移.当由HTML解析器解析时,该属性最终没有命名空间,而不是像XML中的命名空间声明属性那样的" http://www.w3.org/2000/xmlns/ "命名空间.

Answer 2

命名空间在 CSS 中有一个相当讨厌的语法，因为“:”命名空间字符必须用前导反斜杠进行转义，以将其与伪类区分开来：

html\:img {
  border: 2px solid black;
}
html\:a:visited html\:img {
  border-color: grey;
}

这仅在将 HTML 嵌入 XML 文档时才真正有用。添加 html 命名空间时，HTML 命名空间中的元素会像在 HTML 中一样正确显示，允许访问 CSS 尚未提供的功能。

<story xmlns:HTML="http://www.w3.org/Profiles/XHTML-transitional">
  ...
  <restaurant>
    <name>Red Apple Inn</name>
    <logo>
      <HTML:A href="javascript:alert('Visit the Red Apple Inn!')">
        <HTML:IMG src="red-apple.gif" height="50" width="200"/>
      </HTML:A>
    </logo>
    ...

在 HTML5 上下文中，我想不出任何需要它的情况。到目前为止，我在 CSS 中看到命名空间的唯一地方是 Webkit 的 SVG 或 MathML 的默认 CSS，它们使用不同的语法：@namespaceat-rule。

例如，这是来自WebKit/webkit/blob/master/Source/WebCore/css/mathml.css 的代码：

@namespace "http://www.w3.org/1998/Math/MathML";

math {
    -webkit-line-box-contain: glyphs replaced;
    text-indent: 0;
    direction: ltr;
}
mtext {
    line-height: 1.0;
}

...

这是来自WebKit/webkit/blob/master/Source/WebCore/css/svg.css 的代码：

@namespace "http://www.w3.org/2000/svg";
@namespace html "http://www.w3.org/1999/xhtml";

svg:not(:root), symbol, image, marker, pattern, foreignObject {
    overflow: hidden
}

svg:root {
    width: 100%;
    height: 100%
}

text, foreignObject {
    display: block
}

...