JSF页面中的CSS选择器不起作用答案

【问题标题】：CSS selector in JSF page not workingJSF页面中的CSS选择器不起作用
【发布时间】：2013-03-26 02:02:15
【问题描述】：

在 xhtml 页面顶部的样式部分，我有以下 CSS 选择器：

#form\:tabView\:tabExceptions {
    border: 5px solid black;
}

有效。

但是当我尝试使用以下 CSS 选择器时（在页面的同一位置）：

[id$=tabExceptions] {
    border: 5px solid black;
}

它不起作用。

其实，甚至

[id=form\:tabView\:tabExceptions] {
    border: 5px solid black;
}

不工作。

知道为什么吗？

我生成的 HTML：

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head><link type="text/css" rel="stylesheet" href="/my-admin-web-1.0-SNAPSHOT/faces/javax.faces.resource/theme.css?ln=primefaces-blitzer" /><link type="text/css" rel="stylesheet" href="/my-admin-web-1.0-SNAPSHOT/faces/javax.faces.resource/primefaces.css?ln=primefaces" /><script type="text/javascript" src="/my-admin-web-1.0-SNAPSHOT/faces/javax.faces.resource/jquery/jquery.js?ln=primefaces"></script><script type="text/javascript" src="/my-admin-web-1.0-SNAPSHOT/faces/javax.faces.resource/primefaces.js?ln=primefaces"></script><script type="text/javascript" src="/my-admin-web-1.0-SNAPSHOT/faces/javax.faces.resource/jquery.corner.js?ln=js&amp;loc=en"></script>


<link type="text/css" rel="stylesheet" href="http://www.primefaces.org/showcase-labs/css/default.css" />


<style>
/* <![CDATA[ */

.accordionPanel {
    width:800px;
    margin-left:auto;
    margin-right:auto;
}

.tabView {
    width:900px;
    margin-left:auto;
    margin-right:auto;
}

/* div space between accordion tabs */
/*
.ui-accordion .ui-accordion-content {
    margin-bottom: 20px;
    display: block;
}
*/

/* accordion tabs - upper space */
.ui-accordion .ui-accordion-header { margin-top: 50px; }

/* accordion tabs - uppermost tab */
.ui-accordion .ui-accordion-header.do-nothing { margin-top: 0; }

/***************************/
/* Rounded corners: */

.ui-datatable.ui-corner-all table {
    border-collapse: separate;
    *border-collapse: collapse; /* Fallback for IE <=7. */
    border-spacing: 0;
}
.ui-datatable.ui-corner-all table tr:first-child th:first-child {
    -moz-border-radius: 6px 0 0 0; -webkit-border-radius: 6px 0 0 0; border-radius: 6px 0 0 0;
}
.ui-datatable.ui-corner-all table tr:first-child th:last-child {
    -moz-border-radius: 0 6px 0 0; -webkit-border-radius: 0 6px 0 0; border-radius: 0 6px 0 0;
}
.ui-datatable.ui-corner-all table tr:first-child th:only-child{
    -moz-border-radius: 6px 6px 0 0; -webkit-border-radius: 6px 6px 0 0; border-radius: 6px 6px 0 0;
}
.ui-datatable.ui-corner-all table tbody td {
    border-top: 0;
    *border-top: inherit; /* Fallback for IE <=7. */
}
.ui-datatable.ui-corner-all table tr:last-child td:first-child {
    -moz-border-radius: 0 0 0 6px; -webkit-border-radius: 0 0 0 6px; border-radius: 0 0 0 6px;
}
.ui-datatable.ui-corner-all table tr:last-child td:last-child {
    -moz-border-radius: 0 0 6px 0; -webkit-border-radius: 0 0 6px 0; border-radius: 0 0 6px 0;
}
.ui-datatable.ui-corner-all table tr:last-child td:only-child{
    -moz-border-radius: 0 0 6px 6px; -webkit-border-radius: 0 0 6px 6px; border-radius: 0 0 6px 6px;
}

/***************************/

/* http://stackoverflow.com/questions/6874705/is-it-possible-to-use-a-css-wildcard-in-the-middle-of-a-selector/6874731#6874731 */
/* #form\:tabView\:tabExceptions { */
/*
div[id=form\3AtabView\3AtabExceptions] {
    border: 5px solid black !important;
}
*/

/*
#form\:tabView\:tabExceptions {
    border: 5px solid black;
}
*/

[id="form\:tabView\:tabExceptions"] {
    border: 5px solid black;
}

/* ]]> */
</style>


<script>
/* <![CDATA[ */

$(document).ready(function() {
    $(".ui-accordion .ui-accordion-header").corner();
});

/* ]]> */
</script></head><body>
<form id="form" name="form" method="post" action="/my-admin-web-1.0-SNAPSHOT/faces/index.xhtml" enctype="application/x-www-form-urlencoded">
<input type="hidden" name="form" value="form" />
<div id="form:tabView" class="ui-tabs ui-widget ui-widget-content ui-corner-all ui-hidden-container ui-tabs-top tabView" style="border: 5px solid black !important;"><ul class="ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all" role="tablist"><li class="ui-state-default ui-tabs-selected ui-state-active ui-corner-top" role="tab" aria-expanded="true"><a href="#form:tabView:tab1">Home</a></li><li class="ui-state-default ui-corner-top" role="tab" aria-expanded="false"><a href="#form:tabView:tabExceptions">Exceptions</a></li><li class="ui-state-default ui-corner-top" role="tab" aria-expanded="false"><a href="#form:tabView:tab3">Search</a></li><li class="ui-state-default ui-corner-top" role="tab" aria-expanded="false"><a href="#form:tabView:tab4">Process Management</a></li></ul><div class="ui-tabs-panels"><div id="form:tabView:tab1" class="ui-tabs-panel ui-widget-content ui-corner-bottom" role="tabpanel" aria-hidden="false">
<form id="form:tabView:j_idt8" name="form:tabView:j_idt8" method="post" action="/my-admin-web-1.0-SNAPSHOT/faces/index.xhtml" enctype="application/x-www-form-urlencoded">
<input type="hidden" name="form:tabView:j_idt8" value="form:tabView:j_idt8" />
<span id="form:tabView:j_idt8:messages"></span><script id="form:tabView:j_idt8:messages_s" type="text/javascript">$(function(){PrimeFaces.cw('Growl','widget_form_tabView_j_idt8_messages',{id:'form:tabView:j_idt8:messages',sticky:false,life:6000,escape:true,msgs:[]});});</script><div id="form:tabView:j_idt8:j_idt9" class="ui-accordion ui-widget ui-helper-reset ui-hidden-container accordionPanel" role="tablist"><h3 class="ui-accordion-header ui-helper-reset ui-state-default ui-corner-all" role="tab" aria-expanded="false"><span class="ui-icon ui-icon-triangle-1-e"></span><a href="#" tabindex="-1">Exception Volume Today</a></h3><div id="form:tabView:j_idt8:j_idt9:j_idt10" class="ui-accordion-content ui-helper-reset ui-widget-content ui-helper-hidden" role="tabpanel" aria-hidden="true"><div id="form:tabView:j_idt8:j_idt9:j_idt11" class="ui-datatable ui-widget ui-corner-all"><table role="grid"><thead><tr><th id="form:tabView:j_idt8:j_idt9:j_idt11:j_idt14" class="ui-state-default" role="columnheader" colspan="5"><div class="ui-dt-c"><span>2013-02-04</span></div></th></tr><tr><th id="form:tabView:j_idt8:j_idt9:j_idt11:j_idt16" class="ui-state-default" role="columnheader"><div class="ui-dt-c"><span></span></div></th><th id="form:tabView:j_idt8:j_idt9:j_idt11:j_idt17" class="ui-state-default" role="columnheader"><div class="ui-dt-c"><span>Outstanding</span></div></th><th id="form:tabView:j_idt8:j_idt9:j_idt11:j_idt18" class="ui-state-default" role="columnheader"><div class="ui-dt-c"><span>>10 mins</span></div></th><th id="form:tabView:j_idt8:j_idt9:j_idt11:j_idt19" class="ui-state-default" role="columnheader"><div class="ui-dt-c"><span>>20 mins</span></div></th><th id="form:tabView:j_idt8:j_idt9:j_idt11:j_idt20" class="ui-state-default" role="columnheader"><div class="ui-dt-c"><span>>30 mins</span></div></th></tr></thead><tfoot></tfoot><tbody id="form:tabView:j_idt8:j_idt9:j_idt11_data" class="ui-datatable-data ui-widget-content"><tr data-ri="0" class="ui-widget-content ui-datatable-even" role="row"><td role="gridcell"><div class="ui-dt-c">ANF Items</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td></tr><tr data-ri="1" class="ui-widget-content ui-datatable-odd" role="row"><td role="gridcell"><div class="ui-dt-c">Dup Suspects</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td></tr><tr data-ri="2" class="ui-widget-content ui-datatable-even" role="row"><td role="gridcell"><div class="ui-dt-c">Dup UOW</div></td><td role="gridcell"><div class="ui-dt-c">1</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">1</div></td></tr><tr data-ri="3" class="ui-widget-content ui-datatable-odd" role="row"><td role="gridcell"><div class="ui-dt-c">Dup Transactions</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td></tr><tr data-ri="4" class="ui-widget-content ui-datatable-even" role="row"><td role="gridcell"><div class="ui-dt-c">Large $ Suspects</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td></tr></tbody></table></div><script id="form:tabView:j_idt8:j_idt9:j_idt11_s" type="text/javascript">PrimeFaces.cw('DataTable','widget_form_tabView_j_idt8_j_idt9_j_idt11',{id:'form:tabView:j_idt8:j_idt9:j_idt11'});</script></div><h3 class="ui-accordion-header ui-helper-reset ui-state-default ui-corner-all" role="tab" aria-expanded="false"><span class="ui-icon ui-icon-triangle-1-e"></span><a href="#" tabindex="-1">Exception Volume Yesterday</a></h3><div id="form:tabView:j_idt8:j_idt9:j_idt31" class="ui-accordion-content ui-helper-reset ui-widget-content ui-helper-hidden" role="tabpanel" aria-hidden="true"><div id="form:tabView:j_idt8:j_idt9:j_idt32" class="ui-datatable ui-widget ui-corner-all"><table role="grid"><thead><tr><th id="form:tabView:j_idt8:j_idt9:j_idt32:j_idt35" class="ui-state-default" role="columnheader" colspan="5"><div class="ui-dt-c"><span>2012-08-29</span></div></th></tr><tr><th id="form:tabView:j_idt8:j_idt9:j_idt32:j_idt37" class="ui-state-default" role="columnheader"><div class="ui-dt-c"><span></span></div></th><th id="form:tabView:j_idt8:j_idt9:j_idt32:j_idt38" class="ui-state-default" role="columnheader"><div class="ui-dt-c"><span>Outstanding</span></div></th><th id="form:tabView:j_idt8:j_idt9:j_idt32:j_idt39" class="ui-state-default" role="columnheader"><div class="ui-dt-c"><span>>10 mins</span></div></th><th id="form:tabView:j_idt8:j_idt9:j_idt32:j_idt40" class="ui-state-default" role="columnheader"><div class="ui-dt-c"><span>>20 mins</span></div></th><th id="form:tabView:j_idt8:j_idt9:j_idt32:j_idt41" class="ui-state-default" role="columnheader"><div class="ui-dt-c"><span>>30 mins</span></div></th></tr></thead><tfoot></tfoot><tbody id="form:tabView:j_idt8:j_idt9:j_idt32_data" class="ui-datatable-data ui-widget-content"><tr data-ri="0" class="ui-widget-content ui-datatable-even" role="row"><td role="gridcell"><div class="ui-dt-c">ANF Items</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td></tr><tr data-ri="1" class="ui-widget-content ui-datatable-odd" role="row"><td role="gridcell"><div class="ui-dt-c">Dup Suspects</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td></tr><tr data-ri="2" class="ui-widget-content ui-datatable-even" role="row"><td role="gridcell"><div class="ui-dt-c">Dup UOW</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td></tr><tr data-ri="3" class="ui-widget-content ui-datatable-odd" role="row"><td role="gridcell"><div class="ui-dt-c">Dup Transactions</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td></tr><tr data-ri="4" class="ui-widget-content ui-datatable-even" role="row"><td role="gridcell"><div class="ui-dt-c">Large $ Suspects</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td></tr></tbody></table></div><script id="form:tabView:j_idt8:j_idt9:j_idt32_s" type="text/javascript">PrimeFaces.cw('DataTable','widget_form_tabView_j_idt8_j_idt9_j_idt32',{id:'form:tabView:j_idt8:j_idt9:j_idt32'});</script></div><h3 class="ui-accordion-header ui-helper-reset ui-state-default ui-corner-all" role="tab" aria-expanded="false"><span class="ui-icon ui-icon-triangle-1-e"></span><a href="#" tabindex="-1">Volume by Image Channel</a></h3><div id="form:tabView:j_idt8:j_idt9:j_idt52" class="ui-accordion-content ui-helper-reset ui-widget-content ui-helper-hidden" role="tabpanel" aria-hidden="true"><div id="form:tabView:j_idt8:j_idt9:j_idt53" class="ui-datatable ui-widget ui-corner-all"><table role="grid"><thead><tr><th id="form:tabView:j_idt8:j_idt9:j_idt53:j_idt56" class="ui-state-default" role="columnheader" colspan="2"><div class="ui-dt-c"><span></span></div></th><th id="form:tabView:j_idt8:j_idt9:j_idt53:j_idt57" class="ui-state-default" role="columnheader" colspan="2"><div class="ui-dt-c"><span>2013-02-04</span></div></th><th id="form:tabView:j_idt8:j_idt9:j_idt53:j_idt58" class="ui-state-default" role="columnheader" colspan="2"><div class="ui-dt-c"><span>2012-08-29</span></div></th></tr><tr><th id="form:tabView:j_idt8:j_idt9:j_idt53:j_idt60" class="ui-state-default" role="columnheader"><div class="ui-dt-c"><span>Image Channel</span></div></th><th id="form:tabView:j_idt8:j_idt9:j_idt53:j_idt61" class="ui-state-default" role="columnheader"><div class="ui-dt-c"><span>Files Queued</span></div></th><th id="form:tabView:j_idt8:j_idt9:j_idt53:j_idt62" class="ui-state-default" role="columnheader"><div class="ui-dt-c"><span>Files</span></div></th><th id="form:tabView:j_idt8:j_idt9:j_idt53:j_idt63" class="ui-state-default" role="columnheader"><div class="ui-dt-c"><span>Number of Items</span></div></th><th id="form:tabView:j_idt8:j_idt9:j_idt53:j_idt64" class="ui-state-default" role="columnheader"><div class="ui-dt-c"><span>Files</span></div></th><th id="form:tabView:j_idt8:j_idt9:j_idt53:j_idt65" class="ui-state-default" role="columnheader"><div class="ui-dt-c"><span>Number of Items</span></div></th></tr></thead><tfoot></tfoot><tbody id="form:tabView:j_idt8:j_idt9:j_idt53_data" class="ui-datatable-data ui-widget-content"><tr data-ri="0" class="ui-widget-content ui-datatable-even" role="row"><td role="gridcell"><div class="ui-dt-c">VIEX</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">1</div></td><td role="gridcell"><div class="ui-dt-c">29721</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td></tr><tr data-ri="1" class="ui-widget-content ui-datatable-odd" role="row"><td role="gridcell"><div class="ui-dt-c">ULZ</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td></tr><tr data-ri="2" class="ui-widget-content ui-datatable-even" role="row"><td role="gridcell"><div class="ui-dt-c">Totals</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">1</div></td><td role="gridcell"><div class="ui-dt-c">29721</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td><td role="gridcell"><div class="ui-dt-c">0</div></td></tr></tbody></table></div><script id="form:tabView:j_idt8:j_idt9:j_idt53_s" type="text/javascript">PrimeFaces.cw('DataTable','widget_form_tabView_j_idt8_j_idt9_j_idt53',{id:'form:tabView:j_idt8:j_idt9:j_idt53'});</script></div><h3 class="ui-accordion-header ui-helper-reset ui-state-default ui-corner-all" role="tab" aria-expanded="false"><span class="ui-icon ui-icon-triangle-1-e"></span><a href="#" tabindex="-1">Cart Item Exception Volume</a></h3><div id="form:tabView:j_idt8:j_idt9:j_idt80" class="ui-accordion-content ui-helper-reset ui-widget-content ui-helper-hidden" role="tabpanel" aria-hidden="true"><table cellpadding="10">
<tbody>
<tr>
<td>TODO</td>
</tr>
</tbody>
</table>
</div><h3 class="ui-accordion-header ui-helper-reset ui-state-default ui-corner-all" role="tab" aria-expanded="false"><span class="ui-icon ui-icon-triangle-1-e"></span><a href="#" tabindex="-1">Adjustment Volume</a></h3><div id="form:tabView:j_idt8:j_idt9:j_idt83" class="ui-accordion-content ui-helper-reset ui-widget-content ui-helper-hidden" role="tabpanel" aria-hidden="true"><table cellpadding="10">
<tbody>
<tr>
<td>TODO</td>
</tr>
</tbody>
</table>
</div><h3 class="ui-accordion-header ui-helper-reset ui-state-default ui-corner-all" role="tab" aria-expanded="false"><span class="ui-icon ui-icon-triangle-1-e"></span><a href="#" tabindex="-1">Balancing Totals</a></h3><div id="form:tabView:j_idt8:j_idt9:j_idt86" class="ui-accordion-content ui-helper-reset ui-widget-content ui-helper-hidden" role="tabpanel" aria-hidden="true"><table cellpadding="10">
<tbody>
<tr>
<td>TODO</td>
</tr>
</tbody>
</table>
</div><input type="hidden" id="form:tabView:j_idt8:j_idt9_active" name="form:tabView:j_idt8:j_idt9_active" value="x" /></div><script id="form:tabView:j_idt8:j_idt9_s" type="text/javascript">PrimeFaces.cw('AccordionPanel','widget_form_tabView_j_idt8_j_idt9',{id:'form:tabView:j_idt8:j_idt9',multiple:true});</script><input type="hidden" name="javax.faces.ViewState" id="javax.faces.ViewState" value="3488040969710992296:-5460895671588471169" autocomplete="off" />
</form></div><div id="form:tabView:tabExceptions" class="ui-tabs-panel ui-widget-content ui-corner-bottom ui-helper-hidden" role="tabpanel" aria-hidden="true"><div id="form:tabView:tabView2" class="ui-tabs ui-widget ui-widget-content ui-corner-all ui-hidden-container ui-tabs-top tabView"><ul class="ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all" role="tablist"><li class="ui-state-default ui-tabs-selected ui-state-active ui-corner-top" role="tab" aria-expanded="true"><a href="#form:tabView:tabView2:tba12">ANF</a></li><li class="ui-state-default ui-corner-top" role="tab" aria-expanded="false"><a href="#form:tabView:tabView2:tab22">Operator Locks</a></li><li class="ui-state-default ui-corner-top" role="tab" aria-expanded="false"><a href="#form:tabView:tabView2:tab32">Single Item Duplicate Review</a></li><li class="ui-state-default ui-corner-top" role="tab" aria-expanded="false"><a href="#form:tabView:tabView2:tab42">Multiple Item Duplicate Review</a></li><li class="ui-state-default ui-corner-top" role="tab" aria-expanded="false"><a href="#form:tabView:tabView2:tab52">High Dollar Review</a></li></ul><div class="ui-tabs-panels"><div id="form:tabView:tabView2:tba12" class="ui-tabs-panel ui-widget-content ui-corner-bottom" role="tabpanel" aria-hidden="false">

                tab 1

        </div><div id="form:tabView:tabView2:tab22" class="ui-tabs-panel ui-widget-content ui-corner-bottom ui-helper-hidden" role="tabpanel" aria-hidden="true">

                tab 2

        </div><div id="form:tabView:tabView2:tab32" class="ui-tabs-panel ui-widget-content ui-corner-bottom ui-helper-hidden" role="tabpanel" aria-hidden="true"><table cellpadding="10">
<tbody>
<tr>
<td>After a break of more than 15 years, director Francis Ford Coppola and writer Mario Puzo returned to the well for this third and final story of the fictional Corleone crime family.                     Two decades have passed, and crime kingpin Michael Corleone, now divorced from his wife Kay has nearly succeeded in keeping his promise that his family would one day be completely legitimate.</td>
</tr>
</tbody>
</table>
</div><div id="form:tabView:tabView2:tab42" class="ui-tabs-panel ui-widget-content ui-corner-bottom ui-helper-hidden" role="tabpanel" aria-hidden="true"><table cellpadding="10">
<tbody>
<tr>
<td>After a break of more than 15 years, director Francis Ford Coppola and writer Mario Puzo returned to the well for this third and final story of the fictional Corleone crime family.                     Two decades have passed, and crime kingpin Michael Corleone, now divorced from his wife Kay has nearly succeeded in keeping his promise that his family would one day be completely legitimate.</td>
</tr>
</tbody>
</table>
</div><div id="form:tabView:tabView2:tab52" class="ui-tabs-panel ui-widget-content ui-corner-bottom ui-helper-hidden" role="tabpanel" aria-hidden="true"><table cellpadding="10">
<tbody>
<tr>
<td>After a break of more than 15 years, director Francis Ford Coppola and writer Mario Puzo returned to the well for this third and final story of the fictional Corleone crime family.                     Two decades have passed, and crime kingpin Michael Corleone, now divorced from his wife Kay has nearly succeeded in keeping his promise that his family would one day be completely legitimate.</td>
</tr>
</tbody>
</table>
</div></div><input type="hidden" id="form:tabView:tabView2_activeIndex" name="form:tabView:tabView2_activeIndex" value="0" autocomplete="off" /></div><script id="form:tabView:tabView2_s" type="text/javascript">PrimeFaces.cw('TabView','widget_form_tabView_tabView2',{id:'form:tabView:tabView2',effect: {name:'fade',duration:'normal'}});</script></div><div id="form:tabView:tab3" class="ui-tabs-panel ui-widget-content ui-corner-bottom ui-helper-hidden" role="tabpanel" aria-hidden="true"><table cellpadding="10">
<tbody>
<tr>
<td>After a break of more than 15 years, director Francis Ford Coppola and writer Mario Puzo returned to the well for this third and final story of the fictional Corleone crime family.                     Two decades have passed, and crime kingpin Michael Corleone, now divorced from his wife Kay has nearly succeeded in keeping his promise that his family would one day be completely legitimate.</td>
</tr>
</tbody>
</table>
</div><div id="form:tabView:tab4" class="ui-tabs-panel ui-widget-content ui-corner-bottom ui-helper-hidden" role="tabpanel" aria-hidden="true"><table cellpadding="10">
<tbody>
<tr>
<td>After a break of more than 15 years, director Francis Ford Coppola and writer Mario Puzo returned to the well for this third and final story of the fictional Corleone crime family.                     Two decades have passed, and crime kingpin Michael Corleone, now divorced from his wife Kay has nearly succeeded in keeping his promise that his family would one day be completely legitimate.</td>
</tr>
</tbody>
</table>
</div></div><input type="hidden" id="form:tabView_activeIndex" name="form:tabView_activeIndex" value="0" autocomplete="off" /></div><script id="form:tabView_s" type="text/javascript">PrimeFaces.cw('TabView','widget_form_tabView',{id:'form:tabView',effect: {name:'fade',duration:'normal'}});</script><input type="hidden" name="javax.faces.ViewState" id="javax.faces.ViewState" value="3488040969710992296:-5460895671588471169" autocomplete="off" />
</form><div id="j_idt101" style="width:64px;height:64px;position:fixed;right:5px;bottom:5px"><div id="j_idt101_start" style="display:none"><img id="j_idt102" src="http://www.primefaces.org/showcase/images/loading.gif" alt="" /></div><div id="j_idt101_complete" style="display:none"></div></div><script id="j_idt101_s" type="text/javascript">PrimeFaces.cw('AjaxStatus','widget_j_idt101',{id:'j_idt101'});widget_j_idt101.bindFacet('ajaxStart', 'start');widget_j_idt101.bindFacet('ajaxComplete', 'complete');</script>

<style>
/*
[id$=tabExceptions] {
    border: 5px solid black;
}
*/
</style></body>

</html>

【问题讨论】：

请发布您生成的表格。
那将是相当困难的......很多嵌套的 JSF 模板。
运行代码，打开浏览器，右键，查看源代码，选择表单，复制，打开本页，粘贴。
只是减少到最小的代码 sn-p 重现问题？只要问题仍然存在，将 HTML 输出的副本创建到独立的 HTML 文件中并消除所有不必要的 HTML 有多难？顺便说一句，你考虑过只使用类名吗？
附加了生成的 HTML...抱歉，出于某种原因，我认为您实际上想要 xhtml 代码。我的错。

标签： css jsf primefaces css-selectors

【解决方案1】：

它们对我来说都很好......http://jsfiddle.net/ncapito/Sb32y/ 除了你的选择器之外还有其他东西是错误的。

<a id='form:tabView:tabExceptions' >No clue</a>

[id=form\:tabView\:tabExceptions]{
    color: grey;

}
[id$=tabExceptions]{
    background-color:blue
}

【讨论】：

谢谢，它在静态页面中对我有用……但在 xhtml 页面中却不行。
请张贴生成的表单标记（至少<form id=..>）