有人真的在使用css命名空间吗？
相对于实际的css namespaces，人们似乎更喜欢使用诸如SMACSS之类的技术来实现名称空间，原因是什么呢
我在谷歌上搜索了一下，但我找不到任何好的资源。(这让我担心我的google-fu是垃圾(很可能)，或者css命名空间规范是无用的(不太可能))
回答 3
Stack Overflow用户
发布于 2012-05-22 21:46:26
它们涵盖了完全不同的用例。
CSS名称空间用于将CSS应用于混合了来自不同XML名称空间的元素的XML文档。例如，这样你就可以在不混淆的情况下瞄准<foo:p>和<bar:p>。
SMACSS涵盖了编写健壮的CSS的技术，这些CSS不会干扰页面的其他部分。例如，地址簿中的.title不会与出版物列表中的.title混淆。
来自spec的更多细节
注意:在HTML语言中，xmlns属性完全没有作用。它基本上就是一个护身符。它只是稍微简化了与XHTML之间的迁移。当由超文本标记语言分析器分析时，该属性不以名称空间结尾，而不是像XML中的名称空间声明属性那样以"http://www.w3.org/2000/xmlns/“名称空间结束。
Stack Overflow用户
发布于 2015-07-30 19:07:24
名称空间在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，它们使用了不同的语法：@namespace at-rule。
例如，这是来自的代码：
@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;
}
...这是来自的代码：
@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
}
...Stack Overflow用户
发布于 2021-01-24 03:41:21
开始工作太麻烦了。解析HTML语言的浏览器将除某些标记名以外的所有内容都放入默认名称空间中(例如：svg)。也就是说，您可以在特殊的名称空间中创建一个元素：
<html>
<head>
<style>
@namespace foo "http://foo";
foo|div { color: red; }
</style>
</head>
<body>
<div>I'm an HTMLDIVElement</div>
</body>
<script>
const div = document.createElementNS('http://foo', 'div');
div.textContent = 'I am namespaced.';
document.body.appendChild(div);
</script>
</html>
据我所知，HTML解析器无法为您选择另一个名称空间。浏览器的HTML解析器创建的任何元素都是在缺省名称空间中创建的。而且，一旦转义了HTML名称空间，它们就不再是HTMLElement元素。您不能只使用button的标记名，并期望它是一个包含所有样式、交互和属性的HTMLButtonElement。这也意味着没有.innerText、.dir、.offsetTop等超文本标记语言属性，最大的属性是没有.style。这也意味着设置style属性什么也不做。必须在CSS文件中指定所有样式。
这实际上意味着这只适用于有限的XML上下文，而不适用于一般的HTML内容。也许有一种方法可以让您的组件实现HTMLElement，尽管我还没有找到(也许是Web组件？)。尽管如此，这意味着所有的元素都必须用document.createElementNS构建，这可能比寻找另一种方法来确定你的CSS组件的作用域要多得多。
https://stackoverflow.com/questions/10703291
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号