ajaxtoolkit中Tab控件的例子

body { font-family:verdana,tahoma,helvetica; } /* ajax__tab_xp-theme theme */ .ajax__tab_xp-theme .ajax__tab_header { font-family:verdana,tahoma,helvetica; font-size:11px; background:url(img/xp/tab-line.gif) repeat-x bottom; } .ajax__tab_xp-theme .ajax__tab_header .ajax__tab_outer { padding-right:4px; background:url(img/xp/tab-right.gif) no-repeat right; height:21px; } .ajax__tab_xp-theme .ajax__tab_header .ajax__tab_inner { padding-left:3px; background:url(img/xp/tab-left.gif) no-repeat; } .ajax__tab_xp-theme .ajax__tab_header .ajax__tab_tab { height:13px; padding:4px; margin:0; background:url(img/xp/tab.gif) repeat-x; } .ajax__tab_xp-theme .ajax__tab_hover .ajax__tab_outer { background:url(img/xp/tab-hover-right.gif) no-repeat right; } .ajax__tab_xp-theme .ajax__tab_hover .ajax__tab_inner { background:url(img/xp/tab-hover-left.gif) no-repeat; } .ajax__tab_xp-theme .ajax__tab_hover .ajax__tab_tab { background:url(img/xp/tab-hover.gif) repeat-x; } .ajax__tab_xp-theme .ajax__tab_active .ajax__tab_outer { background:url(img/xp/tab-active-right.gif) no-repeat right; } .ajax__tab_xp-theme .ajax__tab_active .ajax__tab_inner { background:url(img/xp/tab-active-left.gif) no-repeat; } .ajax__tab_xp-theme .ajax__tab_active .ajax__tab_tab { background:url(img/xp/tab-active.gif) repeat-x; } .ajax__tab_xp-theme .ajax__tab_body { font-family:verdana,tahoma,helvetica; font-size:10pt; border:1px solid #999999; border-top:0; padding:8px; background-color:#ffffff; } /* ajax__tab_yuitabview-theme theme (img/yui/sprite.png) */ .ajax__tab_yuitabview-theme .ajax__tab_header { font-family:arial,helvetica,clean,sans-serif; font-size:small; border-bottom:solid 5px #2647a0; } .ajax__tab_yuitabview-theme .ajax__tab_header .ajax__tab_outer { background:url(img/yui/sprite.png) #d8d8d8 repeat-x; margin:0px 0.16em 0px 0px; padding:1px 0px 1px 0px; vertical-align:bottom; border:solid 1px #a3a3a3; border-bottom-width:0px; } .ajax__tab_yuitabview-theme .ajax__tab_header .ajax__tab_tab { color:#000; padding:0.35em 0.75em; margin-right:0.01em; } .ajax__tab_yuitabview-theme .ajax__tab_hover .ajax__tab_outer { background: url(img/yui/sprite.png) #bfdaff repeat-x left -1300px; } .ajax__tab_yuitabview-theme .ajax__tab_active .ajax__tab_tab { color:#fff; } .ajax__tab_yuitabview-theme .ajax__tab_active .ajax__tab_outer { background:url(img/yui/sprite.png) #2647a0 repeat-x left -1400px; } .ajax__tab_yuitabview-theme .ajax__tab_body { font-family:verdana,tahoma,helvetica; font-size:10pt; padding:0.25em 0.5em; background-color:#edf5ff; border:solid 1px #808080; border-top-width:0px; } /* ajax__tab_technorati-theme theme */ .ajax__tab_technorati-theme .ajax__tab_header { font-family:"Helvetica Neue", Arial, Sans-Serif; background:url(img/technorati/tab-line.png) repeat-x bottom; font-size:12px; display:block; } .ajax__tab_technorati-theme .ajax__tab_header .ajax__tab_outer { background:url(img/technorati/tab.png) no-repeat left top; border-color:#222; color:#222; padding-left:10px; margin-right:3px; } .ajax__tab_technorati-theme .ajax__tab_header .ajax__tab_inner { background:url(img/technorati/tab.png) no-repeat right top; border-color:#666; color:#666; padding:3px 10px 2px 0px; } .ajax__tab_technorati-theme .ajax__tab_hover .ajax__tab_inner { color:#000000; } .ajax__tab_technorati-theme .ajax__tab_active .ajax__tab_outer { background:url(img/technorati/tab.png) no-repeat 0pt -40px; border-bottom-color:#ffffff; } .ajax__tab_technorati-theme .ajax__tab_active .ajax__tab_inner { background:url(img/technorati/tab.png) no-repeat right -40px; color:#000000; border-color:#333 } .ajax__tab_technorati-theme .ajax__tab_body { font-family:verdana,tahoma,helvetica; font-size:10pt; padding:8px; background-color:#ffffff; border:solid 1px #d7d7d7; border-top-width:0; } /* ajax__tab_msngallery-theme theme */ .ajax__tab_msngallery-theme .ajax__tab_header { background:url(img/msngallery/tab-line.png) repeat-x bottom; font-size:12px; display:block; } .ajax__tab_msngallery-theme .ajax__tab_header .ajax__tab_outer { border:solid 1px #D7DCE1; padding:1px 1px 0px 1px; border-bottom:solid 2px #A8D4D9; background-color:#edf2fb; } .ajax__tab_msngallery-theme .ajax__tab_header .ajax__tab_tab { padding:6px 10px 6px 10px; color:#444444; width:117px; display:block; text-align:center; } .ajax__tab_msngallery-theme .ajax__tab_header .ajax__tab_tab img { height:24px; width:24px; } .ajax__tab_msngallery-theme .ajax__tab_header .ajax__tab_tab div { font-family:Verdana, Arial, Sans-Serif; font-weight:bold; white-space:nowrap; line-height:145%; font-size:92%; } .ajax__tab_msngallery-theme .ajax__tab_active .ajax__tab_outer { padding:0px 0px 0px 0px; border:solid 2px #A8D4D9; border-bottom-color:#ffffff; background-color:#ffffff; } .ajax__tab_msngallery-theme .ajax__tab_body { font-family:verdana,tahoma,helvetica; font-size:10pt; padding:8px; background-color:#ffffff; border:solid 2px #A8D4D9; border-top-width:0; } /* ajax__tab_ie-theme theme */ .ajax__tab_ie-theme .ajax__tab_header { padding-left:5px; } .ajax__tab_ie-theme .ajax__tab_header .ajax__tab_tab { margin-right:0px; background:url(img/ie/tab_unselected.gif); width:116px; padding:9px 0px 3px 0px; text-align:center; color:#006699; font-family:verdana; font-size:13px; display:block; } .ajax__tab_ie-theme .ajax__tab_active .ajax__tab_tab { padding:6px 0px 3px 0px; background:url(img/ie/tab_selected.gif); } .ajax__tab_ie-theme .ajax__tab_body { background:url(img/ie/ie_tabbacker_720x296.jpg) no-repeat; font-size:13px; font-family:verdana; height:296px; width:716px; } .ajax__tab_ie-theme .ajax__tab_body div { padding:8px; }