Fra*_*kie 5 html css xhtml namespaces xforms
我正在开发一个使用ubiquity-xforms的应用程序.以前我一直使用XHTML 1.0 doctype以text/html的形式提供这些页面.
如果我换的MIME类型为application/xhtml + xml,我会看到一个相当大的性能提升,因为JavaScript的可以使用的,而不是什么它现在做的(通过每一次整个DOM树慢慢迭代的get ____ NS()函数,它需要选择一个元素).
但是当我尝试这个时,我的一堆CSS停止了工作.我注意到,当我检查的元素,无论是在Firebug或WebKit每日Web检查,故障点是".classname"和在XForms命名空间的元素'#ID’CSS选择器.我还注意到,在列出的DOM属性中,这些元素缺少'id'和'className'属性.
我的问题是,有没有办法让UA将这些识别为类和ID？
我尝试过的事情无济于事:
这是一些示例xhtml.在Firefox 3.5或Safari 4/WebKit Nightly中不起作用
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:xhtml="http://www.w3.org/1999/xhtml"
xmlns:xf="http://www.w3.org/2002/xforms">
<head>
<style type="text/css">
/* <![CDATA[ */
#test {
background-color: red;
}
.testing {
color: blue;
}
/* ]]> */
</style>
</head>
<body>
<xf:group id="test" class="testing">Test</xf:group>
</body>
弗兰基，
porneL 的答案是正确的——在 XHTML 模式下你必须使用不同的 CSS 规则，@id因为@class.
即使掌握了这些知识，您的问题还没有结束。:)
诱惑可能是将 HTML 和 XHTML CSS 选择器放在一起，并将它们应用到相同的规则：
@namespace xf url(http://www.w3.org/2002/xforms);
xf\:input.surname, xf|input[class~="surname"] {
color: green;
}
然而，另一个问题是 IE 会忽略整个规则，因为它不喜欢 XHTML 语法。在 Ubiquity XForms 中你会看到这样的东西：
@namespace xf url(http://www.w3.org/2002/xforms);
xforms\:hint.active, xf\:hint.active {
display: inline;
}
xf|hint[class~="active"] {
display: inline;
}
正如您所看到的，我们必须使用不同的选择器重复样式。（我们希望通过一个函数来解决这个问题，该函数将抽象出样式设置任务。然后您只需编写一个规则。）
请注意一些额外的事情：