.ajax__tab_wf .ajax__tab_header{font-family: verdana,tahoma,helvetica;font-size: 11px;background: url(../images/Tabs/tab-line.gif) repeat-x bottom;}.ajax__tab_wf .ajax__tab_outer{padding-right: 4px;background: url(../images/Tabs/tab-right.gif) no-repeat right 50%;height: 21px;}.ajax__tab_wf .ajax__tab_inner{padding-left: 3px;background: url(../images/Tabs/tab-left.gif) no-repeat;}.ajax__tab_wf .ajax__tab_tab{height: 13px;padding: 4px;margin: 0;background: url(../images/Tabs/tab.gif) repeat-x;}.ajax__tab_wf .ajax__tab_hover .ajax__tab_outer{background: url(../images/Tabs/tab-hover-right.gif) no-repeat right;}.ajax__tab_wf .ajax__tab_hover .ajax__tab_inner{background: url(../images/Tabs/tab-hover-left.gif) no-repeat;}.ajax__tab_wf .ajax__tab_hover .ajax__tab_tab{background: url(../images/Tabs/tab-hover.gif) repeat-x;}.ajax__tab_wf .ajax__tab_active .ajax__tab_outer{background: url(../images/Tabs/tab-active-right.gif) no-repeat right;}.ajax__tab_wf .ajax__tab_active .ajax__tab_inner{background: url(../images/Tabs/tab-active-left.gif) no-repeat;}.ajax__tab_wf .ajax__tab_active .ajax__tab_tab{background: url(../images/Tabs/tab-active.gif) repeat-x;}.ajax__tab_wf .ajax__tab_body{font-family: verdana,tahoma,helvetica;font-size: 10pt;border: 1px solid #999999;border-top: 0;padding: 8px;background-color: #eeeeee;}
看结果:
请仔细看HeaderText 的右侧部分,有一个约1毫米的空隙。如果放在母板(master)中测试,一切正常,估计又是一个bug。
但回头又想想,我只是想改变背景色而已,用得着那么费劲吗?运行后看编译后的代码
<div id="Tabs" style="width:100%;visibility:hidden;">
<div id="Tabs_header">
<span id="__tab_Tabs_Panel1">基础信息</span><span id="__tab_Tabs_Panel2">明细表</span>
</div>
<div id="Tabs_body" style="height:400px;">
<div id="Tabs_Panel1">
</div>
<div id="Tabs_Panel2" style="display:none;visibility:hidden;">
</div>
</div>
</div>
看到Tabs_body 了吗,只要设置它的背景色就行了,为何不用js指定呢?
<script language="javascript">
var Tabs_body=document.getElementById(''<%=Tabs.ClientID %>'' + ''_body'');
Tabs_body.style.backgroundColor=''#eeeeee'';
</script>