1：js文件
var oldflag = "0" , newflag = "0" , rnewflag = "0" ;
$().ready(function() {
$("input[name='oldPwd']").focus(function(){
settip(3,'o');
}).blur(function(){
cherkname();
});
$("input[name='passWord']").focus(function(){
settip(3,'p');
}).blur(function(){
cherkphone();
});
$("input[name='confirm_password']").focus(function(){
settip(3,'q');
}).blur(function(){
cherkbank();
});
//验证当前密码
var cherkname = function(name){
var name = $("input[name='oldPwd']").val();
var tmp = /^[a-zA-Z0-9_*&#$%@~!]{6,15}$/;
var flag=tmp.test(name);
if(flag){
settip(1,'o');
oldflag = "1";
}else{
settip(2,'o');
oldflag = "0";
}
}
//验证新设密码
var cherkphone = function(){
var name = $("input[name='passWord']").val();
var tmp = /[A-Za-z].*[0-9]|[0-9].*[A-Za-z]/;
var flag=tmp.test(name);
var stlength = name.length;
//长度是否小于6
var s = stlength > 5;
if(flag && s){
settip(1,'p');
newflag = "1";
}else{
settip(2,'p');
newflag = "0";
}
}
//验证确认密码
var cherkbank = function(){
var name = $("input[name='confirm_password']").val();
var tmp = /[A-Za-z].*[0-9]|[0-9].*[A-Za-z]/;
var stlength = name.length;
var flag=tmp.test(name);
var cname = $("input[name='passWord']").val();
var stlength = name.length;
//长度是否小于6
var s = stlength >5;
if((name == cname)&&flag && s){
settip(1,'q');
rnewflag = "1";
}else{
settip(2,'q');
rnewflag = "0";
}
}
//提示
var settip = function(status,name){
$("#"+name+"tip").hide();
$("#"+name+"error").hide();
$("#"+name+"right").hide();
if(status == 1){
$("#"+name+"right").show();
}else if(status == 2){
$("#"+name+"error").show();
}else if(status == 3){
$("#"+name+"tip").show();
}
}
$("#banksubmit").click(function(){
cherkname();
cherkphone();
cherkbank();
if(oldflag == "1"&& rnewflag == "1" && newflag =="1"){
$("#infoForm").submit();
}else
return false;
});
});
HTML文件:
<!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">
<#include "./common/_public.html"/>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>${title}</title>
<link rel="stylesheet" href="${ctx}/html/images/hua.css" type="text/css"/>
<link rel="stylesheet" href="${ctx}/js/jquery/artDialog/skins/default.css" rel="stylesheet" />
<script type="text/javascript" src="${ctx}/js/jquery/artDialog/basic/artDialog.basic.js"></script>
<script type="text/javascript" src="${ctx}/js/jquery/validate/lib/jquery.js"></script>
<script type="text/javascript" src="${ctx}/js/manage/userpswd.js"></script>
</head>
<body>
<#assign mid="channel"/>
<#include "./common/_webTop.html"/>
<#include "./common/_webMenu.html"/>
<div id="main">
<#include "./common/_webSidebar.html"/>
<div id="right">
<div id="reco">
<#include "./common/_webMyChannel.html"/>
</div>
<div id="cont">
<div class="con_top">
<div class="con_left">
<div class="con_right">
<div class="con_bottom">
<span class="to_le">密码修改</span>
<span class="to_ri"></span>
<div class="busins">
<div class="news" style="height:auto;">
<div class="newsd">
<div style="600px;font:bold 14px/20px arial,sans-serif;">
请您确定不要使用公开信息作为密码，如生日、电话，密码过于简单有被盗的风险，一旦密码被盗您的个人信息有泄漏的危险，同时您和您好友的利益也会造成损害。<span style="color:#6495ED">修改密码完毕后请重新登录。</span><br/>
<hr style="height: 1px; border:none; border-top:1px dashed #CCCCCC;" /></div>
<form action="${ctx}/web/user!modifyPwd.do" method="post" name="infoForm" id="infoForm">
<input type="hidden" name="id" value="${loginer.userId?default('')}" />
<input type="hidden" name="page" value="modifypswd"/>
<div class="uidiv">
<ul class="uititle" > 登录账号：</ul>
<ul class="uivalue"><input readonly="true" type="text" class="textfile" value="${loginer.userName?default('')}"/></ul>
</div>
<div class="uidiv" style="640px;">
<ul class="uititle"> 当前密码：</ul>
<ul class="uivalue"><input name="oldPwd" type="password" class="textfile"/></ul>
<ul class='uitip' id="otip" >请设置新的密码,必须包含数字和字母不少于6位数</ul>
<ul class='uierror' id="oerror" >请正确填入您的密码,必须包含数字和字母不少于6位数</ul>
<ul class='uiright' id="oright"></ul>
</div>
<div class="uidiv" style="640px;">
<ul class="uititle" > 新设密码：</ul>
<ul class="uivalue" ><input name="passWord" type="password" class="textfile" /></ul>
<ul class='uitip' id="ptip" >请设置新的密码,必须包含数字和字母不少于6位数</ul>
<ul class='uierror' id="perror" >请正确填入您的密码,必须包含数字和字母不少于6位数</ul>
<ul class='uiright' id="pright" ></ul>
</div>
<div class="uidiv" style="640px;">
<ul class="uititle" > 确认密码：</ul>
<ul class="uivalue" ><input name="confirm_password" type="password" class="textfile" /></ul>
<ul class='uitip' id="qtip">请确定设置的新密码,必须包含数字和字母不少于6位数</ul>
<ul class='uierror' id="qerror">两次输入的密码不一致,请再次输入</ul>
<ul class='uiright' id="qright"></ul>
</div>
<div class="uidiv"> <!--img id="banksubmit" src="../html/images/mini_07.gif" style="15%;cursor:pointer;"/-->
<a href="#" id="banksubmit" class="button5"></a>
</div>
</form>
</div>
</div>
<span class="bo_le"></span>
<span class="bo_ri"></span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<#include "./common/_webFooter.html"/>
</body>
<#if actionMessages?exists>
<#if actionMessages.size() gt 0 >
<script type="text/javascript">
art.dialog({
id: '提示',
content: '修改失败，您填写的当前密码错误',
button: [
{
name: '关闭'
}
]
});
</script>
</#if>
</#if>
<#if result?exists>
<#if result.success>
<script type="text/javascript">
art.dialog({
id: '提示',
content: '修改成功，返回到系统首页',
button: [
{
name: '确定',
callback: function () {
window.location.href="index.do";
},
focus: true
}
]
});
</script>
</#if>
</#if>
</html>
效果:
引用的css文件：
body {margin: 0px;padding: 0px;background-color: #F2F2F2;font-size: 12px;font-family: "锟斤拷锟斤拷"; color:#333333;} p,ul,li,h1,h2,h3{margin: 0px;padding: 0px;} a:link,a:visited {text-decoration: none; color:#333;} a:hover,a:active{color:#666;text-decoration:underline;} #top { width:100%; background-color:#FFFFFF;overflow:hidden;} #top1 { width:920px; margin: 0 auto; height:76px;padding-left:30px;} /**#logo_1 { background:url(hua_08.gif) no-repeat 0 0; 102px; height:57px; float:left; display:block; text-indent:-9999px; margin-top:10px;}**/ #logo_1 {width:353px; height:57px; float:left; display:block; text-indent:-9999px; margin-top:10px;} #logo_2 { background:url(hua_13.gif) no-repeat 0 0; width:251px; height:22px; float:left; display:block; text-indent:-9999px; margin-top: 43px } #top_ri { background:url(hua_05.gif) #F2F2F2 no-repeat right 0; height:23px; float:right; line-height:23px; margin-top: 8px; display:block; text-align:right; padding-right:10px;} .top_lr { float:left; background:url(hua_03.gif) no-repeat left 0;text-indent:15px; } #nav_bg { background:url(hua_18.gif) repeat-x 0 0; width:100%; height:41px; font-size:14px; font-weight:bolder; overflow:hidden;} #nav { width:950px; margin:0 auto;} #nav li {float:left;list-style-type: none; background:url(hua_24.gif) no-repeat right center; width:148px;} #nav li .at:link,#nav li .at:visited{ color:#FFFFFF; background:url(hua_19.gif) no-repeat center 0; width: 124px; height:41px; line-height:45px; display:block; text-align:center; margin:0 auto;} #nav li .at:hover,#nav li .at1 { background:url(hua_21.gif) no-repeat center 0; color:#CC0000;width: 124px; height:41px; line-height:45px; display:block; text-align:center; margin:0 auto;text-decoration: none;} .red { color:#CC0000; font-weight:bolder;} /*login*/ .loginBtn{background:url(lonin_03.gif) no-repeat 0 0; width:93px; height:35px} .error { order-top: 1px dotted #CCCCCC;clear: both;color: #CC0000;font-size:13px;font-variant: small-caps;padding: 0px 0 0 15px;} .errorhide{display:none;} .errortip{font:10px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; color: red;letter-spacing: 2px;text-transform: uppercase; text-align: left; padding: 0px 6px 0px 45px;margin:2px;width:265px;} .usertext{font-family: "Trebuchet MS",Trebuchet,Verdana,Helvetica,Arial,sans-serif;border: 1px solid #CCCCCC;font-size: 14px;margin-left: 3px;padding: 2px;width: 160px;color:#666;} #main{ width:950px; margin:10px auto; overflow:hidden;} #left{ width: 230px; float:left; background:url(hua_88.gif) no-repeat center bottom; padding-bottom:11px;} .info { background:url(hua_40.gif) repeat-y center 0;overflow:hidden;} .info_tit {background:url(hua_30.gif) no-repeat center 0; text-align:center; color:#FFFFFF; font-size:14px; font-weight:bolder; display:block; height:39px; line-height:39px;} .info ul { width:185px; margin:8px auto; overflow:hidden;} .info li { float:left; width:49.5%; list-style-type:none; line-height:18px;} .info_na { text-align:right; font-weight:bolder;} .info_sep { background:url(hua_94.gif) repeat-x 0 0; width:80%; height:4px; margin:0 auto; overflow:hidden;} .info_ce { text-align:center;} .gen { background:url(hua_40.gif) repeat-y center 0; padding-bottom:10px;} .gen_tit { background:url(hua_66.gif) no-repeat center 0; color:#FFFFFF; font-size:14px; font-weight:bolder; display:block; height: 33px; padding-top:16px; text-indent:32px;} .gen ul{ width:201px; margin:0px auto; overflow:hidden; } .gen li {list-style-type:none; line-height:26px;} .gen .bto {border-bottom:1px #CCCCCC dashed;line-height:26px; height:26px; overflow:hidden; clear:left;} #right { width:710px; float:right;} #reco_bg { width:100%; background:url(hua_35.gif) repeat-x 0 0; height:39px; line-height:39px; float:right;} .reco_tit { background:url(hua_32.gif) no-repeat 0 0; width:163px; height:39px; float:left; text-align:center; font-weight:bolder; color:#FFFFFF; font-size:14px;} #reco_bg p { background:url(hua_36.gif) no-repeat right 0; float:right; padding-right:30px;} /*#reco { 700px; background:url(hua_46.gif) repeat-x 0 0; height:169px; float:right; margin-top:12px; margin-bottom:15px;}*/ #reco { width:700px;background:url(hua_46.gif) repeat-x 0 0; height:169px;float:right; margin-top:12px; margin-bottom:15px;} .reco_le {background:url(hua_43.gif) no-repeat 0 0; float:left; height:169px; overflow:hidden; clear:both; display:block; _padding-left:10px;} .reco_le .condition_title { color: #CC0033;left: 15px;font-weight:bold;font-size:14px;line-height: 150%;padding:0px 15px 0 25px;width: 150px;}/*padding: 10px 15px 0 25px;*/ .reco_le .containerprice { margin-left: 55px; } .containerprice a{ padding-left:5px; line-height:25px; } .containerprice a:link,.containerprice a:visited{ color:#000;text-decoration: none; } .containerprice a:hover,.containerprice a:active{ color:red;} .containerprice strong{ color:red; } .containerprice_div{ padding-right:20px;} .keywordform { float: left; margin-top: 6px; padding-left: 20px; } .keywordform .search{ background: url(sho_03.gif) } #reco ul { background:url(hua_47.gif) no-repeat right 0; width:700px; height:169px; overflow:hidden; padding-top:12px;} /*tianjia : height:169px; padding-top:12px;*/ .reco_img { border:1px solid #ccc; padding:1px; } #reco li { width:130px; list-style-type:none; text-align:center; float:left;} /*###*/ /*.oran { 100px!important;80px; height:18px; text-align:center; margin:5px auto!important;margin:5; font-size:11px;overflow:hidden;} .oran a:link, .oran a:visited{color:#FF6600} .oran a:hover {color:#CC0033;} .oran_sc { 100px!important;100px; height:29px; text-align:center; margin:5px auto!important;margin:5; font-size:11px;line-height:16px;overflow:hidden;} .oran_sc a:link, .oran_sc a:visited{color:#FF6600} .oran_sc a:hover {color:#CC0033;} .reco_price { background:url(hua_53.gif) no-repeat 0 0; 97px; height:31px; line-height:31px; margin:7px 12px 0 0;} .reco_price span { margin:7px 7px 0 0; } .reco_price a:link, .reco_price a:visited{ color:#FFFFFF; font-weight:normal;display:block; 36px; float:right; margin:7px 7px 0 0;} .reco_price a:hover { color:#990033;} .reco_price span {font-weight:bolder;color:#666666; float:left; 52px; text-align:center; margin-top:10px;}*/ /*###*/ .ri_br { border-right:1px ;} #cont{ float: right;width:100%; background-color:#EEEEEE; margin-bottom:15px; overflow:hidden;} /*.con_top { background:url(hua_70.gif) repeat-x 0 top; overflow:hidden; margin-bottom:15px;}*/ .con_top { background:url(cont_top_bg.jpg) repeat-x right top;overflow:hidden; } .con_left { background:url(hua_79.gif) repeat-y left top; overflow:hidden; } .con_right { background:url(hua_82.gif) repeat-y right 0; overflow:hidden;} /*.con_bottom {background:url(hua_84.gif) repeat-x 0 bottom; overflow:hidden;}*/ .con_bottom {background:url(bottom_bg.jpg) repeat-x center bottom; overflow:hidden; } .to_le {background:url(hua_68.gif) no-repeat 0 0;width:163px;height:42px;display:block;float:left; font-size:14px; font-weight:bolder; text-align:center; color:#FFFFFF; line-height:50px;} .to_ri {background:url(hua_71.gif) no-repeat 0 0;width:13px;height:12px;display:block;float:right;} .con_tit { background: url(hua_73.gif) repeat-x 0 bottom; width:72%; display:block; float: left; height:27px; padding-top:12px; margin-left:17px; font-size:14px; color:#FF6600; font-weight:bolder; text-align:right;} /*.bo_le {background:url(hua_83.gif) no-repeat 0 0;16px;height:13px;display:block;float:left; _margin-bottom:-1px;} .bo_ri {background:url(hua_86.gif) no-repeat 0 0;13px;height:13px;display:block;float:right;_margin-bottom:-1px;} */ /*.con_con ul a strong { font-family:"寰蒋闆呴粦"; font-weight:normal;}*/ a.con_sub,a.con_sub:visited { color:#333; margin-left:35px;font-size:14px; font-family: "寰蒋闆呴粦"; } a.con_sub:hover,a.con_sub:active { color:#ff6600; } .con_con { width:100%;overflow:hidden;*overflow:visible; clear:both; padding-bottom:12px;} /* qudiao *margin-bottom:20px; */ .con_con ul {/*margin:10px 0 0 12px;*/list-style:none; padding-left:10px; } .con_con li { width:120px; display:block;text-align:center; float:left; margin:10px 8px 18px 10px; _margin:10px 6px 18px 10px; overflow:hidden;} .con_con li img { border:none;} .con_con li a.con_hover, .con_con li a.con_hover:visited{ border:#eeeded solid 1px; float:left; display: block; width:108px; height:169px; padding:4px 5px;} .con_con li a.con_hover:active,.con_con li a.con_hover:hover { border:#f7a976 solid 1px; background:#f3d2bc; color:#fff; display: block; width:108px; height:169px; overflow:hidden; text-decoration:none; } .con_con li a dl { margin:0px; padding:0px;} .con_con li a dl dt { margin-bottom:5px;} .con_con li a dl dd {text-align: center; width:100%; float:left; margin:0px;} .con_con li a dl .con_dd1 { color:#666; height:32px; line-height:18px; overflow:hidden;} .con_con li a dl .con_dd2 {background:url(hua_53.png) no-repeat center 0; height:31px; line-height:31px; margin-top:10px;} .con_con li a dl .con_dd2 span { float:left; width:48px;_width:28px; _margin-left:8px; text-align:center; color:#666666; margin-top:3px;} #page{ margin-top:10px; padding-top:20px; text-align:center} #foot { clear:both; background:url(hua_94.gif) repeat-x 0 0; width:100%; height:63px; overflow:hidden; text-align:center; padding-top:15px; line-height:25px;} .gen span {text-align:center; display:block; float:left; padding:0 1px;} .tr_d1{ width:39px;} .tr_d2{ width:28px;} .tr_d3{ width:70px;} .tr_d4 { width:104px;} .busin { width:100%; overflow:hidden; padding-bottom:15px;} /*.busin ul { 650px; margin:8px auto 0px; overflow:hidden;height:565px;_height:558px; }*/ .busin ul { width: 650px; margin:8px auto 0px; overflow:hidden;} .busin li { list-style-type:none; clear: left; overflow:hidden;} .busin_tibg { background:url(hua_94.gif) repeat-x 0 bottom; padding:5px;} .ti_01 { background:url(huas_07.gif) no-repeat 0 0; width: 68px; height:15px; display:block; margin-left:8px; text-indent:-9999px; } .ti_02 { background:url(huas_10.gif) no-repeat 0 0; width: 68px; height:15px; display:block; margin-left:8px; text-indent:-9999px; } .ti_03 { background:url(huas_12.gif) no-repeat 0 0; width: 68px; height:15px; display:block; margin-left:8px; text-indent:-9999px;} .ti_04 { background:url(huas_14.gif) no-repeat 0 0; width: 96px; height:15px; display:block; margin-left:8px; text-indent:-9999px; } .ti_05 { margin: 15px; font-size:14px; line-height:32px;} .busin_img { border:1px solid #ccc; padding:1px; display:block; float: left; margin:20px;} .busin_p { float:left; width:320px; margin-top:30px; line-height:30px; font-size:14px; margin-right:5px;} .busin_ka1 { background:url(huas_0303.gif) no-repeat 0 0; width:158px; height:45px; display:block; float:left; text-indent:-9999px; margin-top:40px;} .busin_ka { background:url(huas_03.gif) no-repeat 0 0; width:158px; height:45px; display:block; float:left; text-indent:-9999px; margin-top:40px;} .box { border:1px solid #ccc; padding:2px; font-size:14px; width:150px;} .news { width: 650px; margin:8px auto 0px; overflow:hidden;height:565px;_height:558px;} .news_tit { text-align:center; font-size:16px; font-weight:bolder; color:#333333; margin:15px auto;} .news_time { text-align:center; color:#666666; background: url(hua_94.gif) repeat-x scroll 0 bottom; padding-bottom:15px;} .news_con { margin:15px; line-height: 24px; color:#666666;} .news_answer_detail {padding-left:30px; background:url(001_50.gif ) no-repeat; margin-left:40px; line-height: 24px; color:#666666;border-bottom: 1px dashed #CCCCCC;} .news_answer_detail {} #login_new{ position:absolute; top:50%; left:50%;height:504px; margin-top:-252px; margin-left:-423px;background:url(login_bg.jpg) no-repeat 0 0; width:847px;} #login_new .tyno{ font-size:14px; width:180px; margin-left:3px; border: 1px solid #ccc; padding:2px;} .mi:link, .mi:visited {color:#666;text-decoration: underline; font-size:14px;} .mi:hover { color:#CC0000;text-decoration: none;} .n_no{ width:80px !important;} #error_page{ position:absolute; top:50%; left:50%;height:504px; margin-top:-202px; margin-left:-473px;background:url(errorpage.jpg) no-repeat 0 0; width:934px;} #error_page dl{ float:right;padding-top:85px;padding-right:35px;line-height:22px;} #error_page ul{ float:left;width:430px;letter-spacing:1px;padding-right:50px;} #error_page dt{font-size:24px;color:red;} #error_page_div{ font-size:14px;padding-top:8px;font-weight:bolder;width:430px;} #error_page li{ font-size:12px;list-style-type:none; } #error_page_bottom{position:absolute;top:68%;width:100%;} .stati{ overflow: hidden;width: 100%;} .stati_sys {width: 95%; margin:0px auto 0px; overflow:hidden;padding-left:5px!important;padding-left:2px; padding-bottom:12px;} /*jia padding-bottom:12px;*/ .stati_sys li{ float:left; list-style-type:none; } .sys {border-bottom: 1px dashed #ccc; width:300px; height:30px;font-size:14px; text-indent:20px; padding-top:10px;} .sys_ul { margin:0 auto; overflow:hidden; text-align:center;} .inquiry { background: url(hua_03.jpg) no-repeat 0 0; width:158px; height:45px; clear:both; display:block; margin:20px auto; text-indent:-9999px;border:none; cursor:pointer; } .inhover { border:none; cursor:pointer; background: url(g_h4.jpg) no-repeat 0 0; width:158px; height:45px; clear:both; display:block; margin:20px auto; text-indent:-9999px; } .inactive { background: url(g4.jpg) no-repeat 0 0; width:158px; height:45px; clear:both; display:block; margin:20px auto; text-indent:-9999px; } .table_tit{ background:url(hua_07.gif) repeat-x 0 0; text-align:center; font-weight:bolder; color:#666666;} /*.table_tit{ background:url(hua_07.jpg) no-repeat center center; text-align:center; font-weight:bolder; color:#666666;}*/ .tr1{ text-align:center; padding:2px; height:25px; font-size:12px;} /*.tr1 td{padding:2px 0 0 10px}*/ .tr2 {text-align:center; padding:2px; height:25px; background:#f8f8f8; font-size:12px;} .stati2{ overflow: hidden;width: 100%;margin:0px 50px 20px 5px;} .stati2 ul{list-style-type: none;margin:0;padding:0} .stati2 li {float:left;width:100%;height:20px} #mini { width:443px;margin:0 auto;background:url(mini_10.gif) #eee no-repeat 0 bottom; overflow:hidden; padding-bottom:10px; font-size:14px; } #mini_tit { background:url(mini_03.gif) no-repeat 0 0; height:47px; width:443px; text-indent:40px; color:#FFFFFF; font-weight:bolder; line-height:47px;} .mini_close { background:url(mini_04.gif) no-repeat 0 bottom; height:12px; width:14px; display:block; text-indent:-9999px;float:right; line-height:12px; padding: 15px 20px 0 0;} .mini_span { float:left;} #mini_con {height:600px; border-width: 0 1px; padding:45px 0;text-align:left;} #mini_con p { width: 569px; margin:0 auto; line-height: 40px; height:40px;} .mini_1{ background:url(mini_07.gif) no-repeat 0 0; width:100px; height: 28px; margin:10px auto 0; border:none; text-indent:-9999px; display:block; cursor:pointer} .mini_2{ background:url(g_h5.jpg) no-repeat 0 0; width:100px; height: 28px; } .mini_3{ background:url(g5.jpg) no-repeat 0 0; width:100px; height: 28px;} .know { background: url(hus_03.gif) repeat-x 0 0; height:37px; line-height:37px; padding-left:30px; margin:20px 0;} .kn:link, .kn:visited { background:url(hus_07.gif) no-repeat 0 0; width:118px; text-align:center; display:block; height:37px; margin-right:12px; font-size:14px;} .kn:hover, .kn1 { background:url(hus_05.gif) no-repeat 0 0; font-weight:bolder;text-decoration: none; width:118px; text-align:center; display:block; height:37px; margin-right:12px; font-size:14px;} /* Caution! Ensure accessibility in print and other media types... */ @media projection, screen { /* Use class for showing/hiding tab content, so that visibility can be better controlled in different media types... */ .ui-tabs-hide { display: none; } } /* Hide useless elements in print layouts... */ @media print { .ui-tabs-nav { display: none; } } #container-1{ border:#ccc 1px double;position:absolute;left:345px; top:180px;width:350px;} #container-logo {height:60px;left: 349px;position: absolute;top: 95px; width: 353px;} #fragment-1 img{ margin:0; padding:0px; border:0px; float:left;} .ui-tabs-panel{width:333px;overflow:hidden;} .ui-tabs-nav, .ui-tabs-panel { font-family: "Trebuchet MS", Trebuchet, Verdana, Helvetica, Arial, sans-serif; font-size: 14px; } .ui-tabs-nav { list-style: none; background:none; } .ui-tabs-nav:after { /* clearing without presentational markup, IE gets extra treatment */ display: block; clear: both; content: " "; } .ui-tabs-nav li { float: left; /*min- 84px; be nice to Opera */ } .ui-tabs-nav a, .ui-tabs-nav a span { display: block; width:175px; height:32px; line-height:32px; } .ui-tabs-nav a { margin: 1px 0 0; /* position: relative makes opacity fail for disabled tab in IE */ padding-left: 0; color: #27537a; font-weight: bold; line-height: 1.2; text-align: center; text-decoration: none; white-space: nowrap; /* required in IE 6 */ outline: 0; /* prevent dotted border in Firefox */ } .ui-tabs-nav .ui-tabs-selected a { position: relative; top: 1px; z-index: 2; margin-top: 0; color: #000; } *>.ui-tabs-nav a span { /* hide from IE 6 */ width: auto; height: auto; } .ui-tabs-nav a{ background:#EDEDED; } .ui-tabs-nav .ui-tabs-selected a span, .ui-tabs-nav a:focus span, .ui-tabs-nav a:active span { background:#fff; } .ui-tabs-nav a span, .ui-tabs-nav .ui-tabs-disabled a:hover span, .ui-tabs-nav .ui-tabs-disabled a:focus span, .ui-tabs-nav .ui-tabs-disabled a:active span { } .ui-tabs-nav .ui-tabs-selected a:link, .ui-tabs-nav .ui-tabs-selected a:visited, .ui-tabs-nav .ui-tabs-disabled a:link, .ui-tabs-nav .ui-tabs-disabled a:visited { /* @ Opera, use pseudo classes otherwise it confuses cursor... */ cursor: text; } .ui-tabs-nav a:hover, .ui-tabs-nav a:focus, .ui-tabs-nav a:active { /* @ Opera, we need to be explicit again here now... */ cursor: pointer; } .ui-tabs-disabled { opacity: .4; filter: alpha(opacity=40); } .ui-tabs-panel { padding: 1em 8px; background: #fff; /* declare background color for container to avoid distorted fonts in IE while fading */ } .ui-tabs-loading em { background: url(loading.gif) no-repeat 0 50%; } /* Additional IE specific bug fixes... */ * html .ui-tabs-nav { /* auto clear, @ IE 6 & IE 7 Quirks Mode */ display: inline-block; } *:first-child+html .ui-tabs-nav { /* @ IE 7 Standards Mode - do not group selectors, otherwise IE 6 will ignore complete rule (because of the unknown + combinator)... */ display: inline-block; } /*login.html */ .tclss{ height:22px;width:50px;font-size:14px;max-height:22px;line-height:22px; } /*modifyuser.html */ .busins { width:100%; overflow:hidden;} .newsd{padding:5px 0px; font:12px/20px arial,sans-serif;} .uierror{float:left;display:none; border: 1px solid #EED1D2;color: #CC0000;height: 34px;line-height: 34px;margin-top: 4px;margin:2px;overflow: hidden;padding: 0 10px 0 30px;width:245px; background: url('wrong.png') no-repeat 6px center;BACKGROUND-COLOR:#fff;} .uitip{float:left;height: 34px;display:none;line-height: 34px;margin-top: 4px;overflow: hidden;padding: 0 5px 0 30px;width:249px;margin:3px; background: url('delete.gif') no-repeat 6px center;BACKGROUND-COLOR:#fff;} .uiright{float:left; line-height: 34px;height:30px;margin-top: 4px;overflow: hidden;padding: 0 5px 0 30px;margin:3px; background: url('right.png') no-repeat 6px center;} .textfile{font-size: 13px;height:25px;padding: 1px 5px;line-height:25px;width:178px;margin:3px; border:#cccccc solid 1px;} .uititle{float:left;width:120px;height:34px;margin-top: 4px;font-size:13px;text-align:right;padding:4px 0;} .uivalue{float:left;width:200px;height:34px;} .uidiv{float:left;width:620px;font-size:13px;padding:2px 5px;} /*forum*/ .forum { width:100%; _height:50px} .forum .forum_left{width:20%;_height:200px;float:left;text-align:center;color:#CCCCCC;border-top: 25px none;} .forum .forum_left ul li{list-style:none;} .forum_img{height:70px;} .forum .forum_right{width:80%;_height:200px;float:left;margin:8px auto 0px; overflow:hidden;} .forum_tit { text-align:center; font-size:14px; font-weight:bolder; color:#333333; margin:15px auto;} .forum_tit2{ text-align:right; color:#666666;} .forum_con { margin-left:20px; line-height: 18px; } .stati_forum{width: 95%; margin:8px auto 0px; overflow:hidden;height:565px;_height:558px;} .reply_tit {background:url(hua_68.gif) no-repeat 0 0;width:163px;height:42px;display:block;font-size:14px; font-weight:bolder; text-align:center; color:#FFFFFF; line-height:50px;} /*recommend css modify **/ .recWay_box { border:1px solid #ccc; padding:2px; width:100px; _margin-top:8px;} .reco_le dl dt a:link ,.reco_le dl dt a:visited { color:#000; text-decoration:none;} .reco_le dl dt a:active,.reco_le dl dt a:hover { color:#f00; text-decoration: underline;} .dls{ background: url("cate-line.png") no-repeat scroll right top transparent; float:left; line-height: 160%; padding: 0 16px 0 0!important; padding: 0 6px 0px 5px; width:154px!important; width:154px; display: block; margin:0px 6px 0px 3px; _margin-right:15px; _padding-left:0px; } .dls dt{ line-height:160%; padding:0px 15px 0 10px!important; padding:0; width: 150px!important; width: 138px; } .dls dd{ line-height:160%; width: 150px!important; width: 138px; } .dle{ float: left; margin:0px; /*_margin-left:16px;*/ line-height: 160%; padding:0 5px 0 0!important; padding-left:8px; width: 150px!important; width:138px; display:inline; } .dle dt{ line-height: 160%; padding: 0 5px 0 10px!important; padding:0px; width: 150px!important; width: 138px; } .dle dd{ font-weight:bolder; float: left; line-height: 160%; padding: 0 5px 0 10px!important; padding:0px; width: 150px!important; width: 138px; text-align:left; } /*mychannel */ .stati_sys_span span { font-size:11px;color:#666;width:130px;} a.stati_sys_span:link,a.stati_sys_span:visited { font-size:11px;color:#666;width:130px; } a.stati_sys_span:active, a.stati_sys_span:hover { color:#ff0; text-decoration:underline;} .stati_sys_sub { clear:both; padding:10px 10px 10px 20px; } .stati_sys_sub table tr td { line-height:28px;} .stati_sys_sub table tr td span { color:#003C9B;} .info-label { float: left; padding-right: 16px; text-align: right; width: 73px; border: 0 none; font-family: inherit; font-size: 100%; font-style: inherit; font-weight: inherit; margin: 0; padding: 0; text-decoration: none; vertical-align: baseline; color: #686868; line-height: 150%; display:inline; } .info-content { display: block; margin-left: 10px; width: 263px; word-wrap: break-word; color: #003C9B; line-height: 150%; display:inline; } .mail-label { float:left; padding-left:20px; display: block; text-align: left; width: 530px; border: 0 none; font-family: inherit; font-size: 100%; font-style: inherit; font-weight: inherit; margin: 0; padding-top: 2px; text-decoration: none; vertical-align: baseline; color: #686868; line-height: 150%; overflow:hidden; display:inline; } .mail-date { text-align: left; font-size: 100%; font-family: inherit; font-weight: inherit; padding-top: 2px; margin: 0; vertical-align: baseline; color: #686868; line-height:160%; overflow:hidden; display:inline; /*line-height:22px;*/ } .mail-label img{ width:18px;height:18px;vertical-align:middle; } div.RoundedCorner{background: #FFF;width:100%;} b.rtop, b.rbottom{display:block;background: #F2F2F2} b.rtop b, b.rbottom b{display:block;height:1px;overflow: hidden; background: #fff} b.r1{margin: 0 5px} b.r2{margin: 0 3px} b.r3{margin: 0 2px} b.rtop b.r4, b.rbottom b.r4{margin: 0 1px;height: 2px} .RoundedCorner p{ line-height:22px; } #RoundedCorner2 {margin-left: 5px; margin-top:0px; padding: 5px; width: 97%; height: 120px; } #RoundedCorner2 p { line-height:23px;} .product_div { float:left; width:690px; } .product_div li{ float:left; width:130px; padding-left:5px!important; padding-left:3px; /*height:160px;*/ text-align:center; } #login_404{ position:absolute; top:50%; left:50%;height:352px; margin-top:-176px; margin-left:-233px; width:466px;background:url(errorpage.gif) no-repeat 0 0;} a.button1 {background:url(hua_56.gif) no-repeat 0 0; display: block; width:67px; height:25px; } a.button1:hover { background:url(g_h1.jpg) no-repeat 0 0; display: block; width:67px; height:25px; } a.button1:active { background:url(g1.jpg) no-repeat 0 0; display: block; width:67px; height:25px; } a.button2 {background:url(hua_58.gif) no-repeat 0 0; display: block; width:67px; height:25px; } a.button2:hover { background:url(g_h2.jpg) no-repeat 0 0; display: block; width:67px; height:25px; } a.button2:active { background:url(g2.jpg) no-repeat 0 0; display: block; width:67px; height:25px; } a.button3 {background:url(sho_03.gif) no-repeat center top; display: block; float:left; width:67px; height:25px; margin-left:5px; overflow:hidden;} a.button3:hover { background:url(g_h3.jpg) no-repeat center top; display:block; float:left; width:67px; height:25px;margin-left:5px; overflow:hidden; } a.button3:active { background:url(g3.jpg) no-repeat center top; display:block; float:left; width:67px; height:25px; margin-left:5px; overflow:hidden; } a.button5 {background:url(mini_07.gif) no-repeat center top; display: block; width:100px; height:28px; margin-bottom:15px;} a.button5:hover { background:url(g_h5.jpg) no-repeat center top; display:block; width:100px; height:28px; margin-bottom:15px; } a.button5:active { background:url(g5.jpg) no-repeat center top; display:block; width:100px; height:28px; margin-bottom:15px; } a.button6 {background:url(g6.jpg) no-repeat center top; display: block; width:67px; height:25px; margin-bottom:15px;} a.button6:hover { background:url(g6.jpg) no-repeat center top; display:block; width:67px; height:25px; margin-bottom:15px; } a.button6:active { background:url(g6.jpg) no-repeat center top; display:block;width:67px; height:25px; margin-bottom:15px; }
需要的图片文件: