http://www.asp.net/AJAX/AjaxControlToolkit/Samples/Tabs/Tabs.aspx
TabContainer是个集合、容器，里面可以包含多个TabPanel。系统提供的样式很不理想需要override。
搞了大半天，才搞大概。
我的CSS：
1
/*tab没有激活字体颜色，背景*/
2
.CustomTabStyle .ajax__tab_header
3{
4
5
6 background: url(../images/b/che_service.gif) repeat-x bottom;
7
8 color:White;
9
10
}
11/*可以设置tab背景图片——左；tab内容与tab的填充距离*/
12.CustomTabStyle.ajax__tab_outer
13{ padding-right:20px;
14 padding-left:20px;
15
16}
17
18/*可以设置tab背景图片——右；tab内容与tab的填充距离*/
19
20.CustomTabStyle.ajax__tab_inner
21{
22
23}
24/*激活tab的样式——背景，字体颜色*/
25.CustomTabStyle.ajax__tab_active
26{
27 font-family: verdana,tahoma,helvetica;
28 font-size: 11px;
29 background: url(../images/b/che_serviced.gif) repeat-x bottom;
30 height: 29px;
31 line-height: 29px;
32 color:#185445;
33 font-weight:bold;
34}
35/*可以设置tab背景图片——中*/
36.CustomTabStyle.ajax__tab_tab
37{
38 font-size:14px;
39
40 margin-right:4px;
41
42}
43/*tab主体样式——上边无边框*/
44.CustomTabStyle.ajax__tab_body
45{
46 border-bottom :solid 1px green;
47 border-left:solid 1px green;
48 border-right:solid 1px green;
49 border-top:0;
50
51}
/*tab没有激活字体颜色，背景*/2
.CustomTabStyle .ajax__tab_header3
{
}4
5
6
background: url(../images/b/che_service.gif) repeat-x bottom;7
8
color:White;9
10
}11
/*可以设置tab背景图片——左；tab内容与tab的填充距离*/12
.CustomTabStyle.ajax__tab_outer13
{ padding-right:20px;14
padding-left:20px; 15
16
}17
18
/*可以设置tab背景图片——右；tab内容与tab的填充距离*/19
20
.CustomTabStyle.ajax__tab_inner21
{ 22
23
}24
/*激活tab的样式——背景，字体颜色*/25
.CustomTabStyle.ajax__tab_active26
{27
font-family: verdana,tahoma,helvetica;28
font-size: 11px;29
background: url(../images/b/che_serviced.gif) repeat-x bottom;30
height: 29px;31
line-height: 29px;32
color:#185445;33
font-weight:bold;34
}35
/*可以设置tab背景图片——中*/36
.CustomTabStyle.ajax__tab_tab 37
{38
font-size:14px;39
40
margin-right:4px;41
42
}43
/*tab主体样式——上边无边框*/44
.CustomTabStyle.ajax__tab_body45
{46
border-bottom :solid 1px green;47
border-left:solid 1px green;48
border-right:solid 1px green;49
border-top:0;50
51
}我的HTML
我的HTML我的效果图：
主要是ajax__tab_header、ajax__tab_active和ajax__tab_body三个样式起了重要作用。
系统提供的那个示例，“Contrls”后面是一条线，其实是背景图片。源码样式：
.ajax__tab_xp .ajax__tab_header {font-family:verdana,tahoma,helvetica;font-size:11px;background:url(<%=WebResource("AjaxControlToolkit.Tabs.tab-line.gif")%>) repeat-x bottom;}
一是背景图片要1*1的大小，二是：background中的bottom
最后,还右两个问题不知道怎么解决。
一．设置每个tab之间的间距。
二．同一个页面多个TabContainer只能用一个样式。我写了个样式
.CustomTabStyle2.ajax__tab_body
{
border-bottom :solid 1px red;
border-left:solid 1px red;
border-right:solid 1px red;
border-top:0;
}
“家政服务”那个TabContainer调用后，原来的第一个TabContainer的边框也变成红色了，
本想让它不变。附源码样式
源码样式