/*
xp theme
*/
.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 ;
}
看结果:
.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指定呢?
< 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 >
<
script language
=
"
javascript
"
>
var Tabs_body = document.getElementById(' <%= Tabs.ClientID %> ' + '_body');
Tabs_body.style.backgroundColor = '#eeeeee';
</ script >
看截图:
var Tabs_body = document.getElementById(' <%= Tabs.ClientID %> ' + '_body');
Tabs_body.style.backgroundColor = '#eeeeee';
</ script >
大功告成!