Question

我正在开发一个使用ubiquity-xforms的应用程序。以前我一直使用XHTML 1.0 doctype以text / html的形式提供这些页面。

如果我将mime-type切换到application / xhtml + xml，我会看到相当大的性能提升，因为javascript可以使用get ____ NS（）函数，而不是它现在正在做的事情（慢慢地遍历整个DOM）每次需要选择一个元素时都会出现树。）

但是当我尝试这个时，我的一堆CSS停止了工作。我注意到，当我在Firebug或WebKit Nightly Web Inspector中检查元素时，失败点是XFORMS命名空间中元素的'.classname'和'#id'css选择器。我还注意到，在列出的DOM属性中，这些元素缺少'id'和'className'属性。

我的问题是，有没有办法可以让UA将这些识别为类和ID？

我尝试过的事情无济于事：

在内联doctype的ATTLIST
尝试我可以使用的每种文档类型，或者根本不尝试任何文档类型
限定xhtml命名空间中的id和class name属性（即.xhtml：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>

Answer 1

羊羊

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;
}

正如您所看到的，我们必须使用不同的选择器重复样式。（这是我们希望用一个能够抽象出样式设置任务的函数来解决的问题。然后你只需编写一个规则。）

注意一些额外的事情：

HTML规则使用'：'作为文字字符（因此转义为'\'），并且对命名空间一无所知;
XHTML CSS规则使用'〜='运算符，这意味着该属性必须包含指定的值，而不是完全等于它。

Answer 2

您不必使用#id / .class选择器。相反，您可以使用：

[id=test] {}
[class|=testing] {}

是等价的。

AFAIK类是特定于HTML的东西，并且因为XML命名空间完全是疯狂的，所以XHTML属性不在XHTML命名空间中！你可能对这个没有好运。

对于ID，您可以尝试xml:id，但我还没有检查是否有任何实际支持它。

如果您想匹配命名空间元素，可以使用CSS Namespaces：

@namespace xf "http://www.w3.org/2002/xforms";
xf|group {}

Answer 3

你没有doctype，字符编码等等。你走了：

准确地改变：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <!--Always include character encoding and content-type-->
    <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />
</head>

您可以使用id和类名称css选择器在另一个命名空间中设置XHTML元素的样式吗？

3 个答案: