html冒号选择器,如何在CSS选择器中使用JSF生成的带有冒号“：”的HTML元素ID？...

慕神8447489

这个:是css标识符中的一个特殊字符，它表示伪类选择器喜欢:hover, :first-child等等，你需要逃离它。#phoneForm\:phoneTable {

    background: pink;}这只在IE6/7中不起作用。如果您也想支持这些用户，请使用\3A相反(后面有一个尾随的空间！)#phoneForm\3A phoneTable {

    background: pink;}以上内容适用于所有浏览器。解决这一问题的其他方法有几种：只需将其封装在一个普通的HTML元素中，然后通过它进行样式处理。

        带着#phoneField table {

    background: pink;}使用class而不是id..例如：带着.pink {

    background: pink;}或table.pink {

    background: pink;}另外的好处是这允许更多的抽象自由。CSS可以在多个元素上重用，而不需要在其他元素上重复使用相同的属性，而无需添加选择器和/或复制属性。因为JSF2.x：更改JSF默认值UINamingContainer中的下列上下文Param分隔符web.xml..例如：

    javax.faces.SEPARATOR_CHAR

    -以便分隔符变成-而不是:.#phoneForm-phoneTable {

    background: pink;}缺点是您需要确保您自己在ID中的任何地方都不使用这个字符，因此这是一种非常脆弱的方法。因为JSF1.2只：禁用表单的前缀id.

    这样你就可以用#phoneTable {

    background: pink;}缺点是找不到它，而且它被认为是糟糕的实践：使用preendId=“false”的UIForm中断..此属性并不存在于所有其他属性中。UINamingContainer组件，所以您仍然必须以正确的方式处理它们(这里是上面的#1和/或#2)。在……里面你的具体情况下，我认为将其转换为CSS类(如#2所述)是最合适的解决方案。一个“电话桌”，即似乎不代表一个网站的独特元素。真正的网站范围内的独特元素，如页眉、菜单、内容、页脚等，通常不会包装在JSF表单或其他JSF命名容器中，因此它们的ID无论如何都不会加上前缀。另见：如何使用jQuery选择JSF组件？默认情况下，JSF生成不可用的ID，这些ID与web标准的css部分不兼容。