日期:2014-05-18 浏览次数:20540 次
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>儒通软件Tab示例</title> <style type="text/css"> *{margin:0; padding:0} body{text-align:center; background-color:#666; font-size:12px; color:#000;} #container{text-align:left; width:760px; height:400px; background-color:#FFF; padding:20px;margin:10px auto;} #container #title{height:28px} #container #title li{float:left; list-style-type:none; height:28px; line-height:28px; text-align:center; margin-right:1px} #container #title ul{background-color:#FFF; height:28px} #container #title a{text-decoration:none; color:#000; display:block; width:auto; background:url(http://pics.taobao.com/2k5/sys/component/tab_selected_left_bk2.gif) no-repeat left -29px} #container #title a span{display:block; background:url(http://pics.taobao.com/2k5/sys/component/tab_selected_right_bk2.gif) no-repeat right -29px; padding:0 15px} #container #content ul{margin:10px} #container #content li{margin:5px} #container #content li img{display:block; margin:5px} #container #content{height:300px; padding:10px} .content1{background-color:#DFEBF7; border-color:#3A81C8; border-style:solid; border-width:3px 1px 1px} .content2{background-color:#FFECD2; border-color:#ff950b; border-style:solid; border-width:3px 1px 1px} .content3{height:300px; background-color:#FFECF5; border-color:#FE74B8; border-style:solid; border-width:3px 1px 1px; padding:10px} .content4{height:300px; background-color:#E8FFFD; border-color:#00988B; border-style:solid; border-width:3px 1px 1px; padding:10px} .content5{height:300px; background-color:#F7FAE2; border-color:#A8BC1F; border-style:solid; border-width:3px 1px 1px; padding:10px} .hidecontent{display:none} #container #title #tag1 a:hover, #container #title .selectli1{text-decoration:none; color:#fff; display:block; width:auto; background:url(http://pics.taobao.com/2k5/sys/component/tab_selected_left_bk2.gif) no-repeat left -87px} #container #title #tag1 a:hover span, #container #title a .selectspan1{display:block; background:url(http://pics.taobao.com/2k5/sys/component/tab_selected_right_bk2.gif) no-repeat right -87px; padding:0 15px} #container #title #tag2 a:hover, #container #title .selectli2{text-decoration:none; color:#fff; display:block; width:auto; background:url(http://pics.taobao.com/2k5/sys/component/tab_selected_left_bk2.gif) no-repeat left 0} #container #title #tag2 a:hover span, #container #title a .selectspan2{display:block; background:url(http://pics.taobao.com/2k5/sys/component/tab_selected_right_bk2.gif) no-repeat right 0; padding:0 15px} #container #title #tag3 a:hover, #container #title .selectli3{text-decoration:none; color:#fff; display:block; width:auto; background:url(http://pics.taobao.com/2k5/sys/component/tab_selected_left_bk2.gif) no-repeat left -58px} #container #title #tag3 a:hover span, #container #title a .selectspan3{display:block; background:url(http://pics.taobao.com/2k5/sys/component/tab_selected_right_bk2.gif) no-repeat right -58px; padding:0 15px} #container #title #tag4 a:hover, #container #title .selectli4{text-decoration:none; color:#fff; display:block; width:auto; background:url(http://pics.taobao.com/2k5/sys/component/tab_selected_left_bk2.gif) no-repeat left -145px} #container #title #tag4 a:hover span, #container #title a .selectspan4{display:block; background:url(http://pics.taobao.com/2k5/sys/component/tab_selected_right_bk2.gif) no-repeat right -145px; padding:0 15px} #container #title #tag5 a:hover, #container #title .sele