主題：asp.net for AJAX 的 TabContainer 切換面板-範例

成果

使用中→滑鼠經過→預設


css--------------------------------------------------------------------------------------------------------------

/* AJAX - TabContainer */

.ajax__tab_default .ajax__tab_header /*整體按鈕底*/{
font-family:"新細明體"; /*設定文字*/
font-size:13px; /*文字大小*/
background:url("ajax_tab_15.gif") repeat-x bottom; /*背景圖片，水平重複，靠下對齊*/}

.ajax__tab_default .ajax__tab_body /*資料區*/{
font-family:"新細明體";/*文字字體*/
border:1px solid #CCCCCC;/*邊框*/
border-top:0;/*背景顏色*/
padding: 8px; /*文字與邊框間隔*/
font-size: 12px;/*文字大小*/
}


.ajax__tab_default .ajax__tab_outer /*預設-右邊*/{
background:url("ajax_tab_14.gif") no-repeat right;/*背景圖片，不重複，靠右對齊*/
padding-right: 3px;/*右邊距離*/
}


.ajax__tab_default .ajax__tab_inner /*預設-左邊*/{
padding-left:3px;/*左邊距離*/
background:url("ajax_tab_11.gif") no-repeat;/*背景圖片，不重複*/}


.ajax__tab_default .ajax__tab_tab /*預設-中間*/{
background:url("ajax_tab_12.gif") repeat-x; /*文字與圖片邊間隔*/
margin:0;/*邊界為0*/
padding-top: 8px;/*文字上間隔*/
padding-right: 15px;/*文字右間隔*/
padding-bottom: 9px;/*文字下間隔*/
padding-left: 15px;/*文字左間隔*/
/*上+下+文字大小= 圖片高度*/
}


.ajax__tab_default .ajax__tab_hover .ajax__tab_outer /*滑鼠經過-右*/{
background:url("ajax_tab_09.gif") no-repeat right;/*背景圖片，不重複，靠右對齊*/
}


.ajax__tab_default .ajax__tab_hover .ajax__tab_inner /*滑鼠經過-左*/{background:url("ajax_tab_06.gif") no-repeat; /*背景圖片，不重複*/}

.ajax__tab_default .ajax__tab_hover .ajax__tab_tab /*滑鼠經過-中*/{
background:url("ajax_tab_07.gif") repeat-x;/*背景圖片，水平重複*/
color: #006699;/*文字顏色*/
}

.ajax__tab_default .ajax__tab_active .ajax__tab_outer/*使用中-右*/{background:url("ajax_tab_04.gif") no-repeat right;/*背景圖片，不重複，靠右對齊*/}


.ajax__tab_default .ajax__tab_active .ajax__tab_inner /*使用中-左*/{background:url("ajax_tab_01.gif") no-repeat;/*背景圖片，不重複*/}


.ajax__tab_default .ajax__tab_active .ajax__tab_tab /*使用中-中*/{
background:url("ajax_tab_03.gif") repeat-x;/*背景圖片，水平重複*/
color: #999999;/*文字顏色*/
}


→原始檔下載

---

以下內容只有回覆後才可以瀏覽

---

.ajax__tab_default .ajax__tab_body /*資料區*/{
font-family:"新細明體";/*文字字體*/
border:1px solid #CCCCCC;/*邊框*/
border-top:0;/*背景顏色*/
padding: 8px; /*文字與邊框間隔*/
font-size: 12px;/*文字大小*/

非常感謝!!~~正好需要一個範例來學習!!!~

好像不錯~

多謝唷~~~

^___^

good ,i like it

fuykg

甘溫~看不懂~先來看看範例

look

感覺不錯感謝先來看看範例

 

！！！！！！！！！！！！！！！！！！！！！！！！！！