系统的Ajax操作需要一些固定的样式,在做模板的时候,需要引进system.css样式表,同时也应避免使用同名的样式。
主体部分
/** 位置 **/ .l{text-align:left}.r{text-align:right}.c{text-align:center} /** 浮动 **/ .fl{float:left}.fr{float:right} /** 宽度 百分比 **/ .p5{width:5%}.p10{width:10%}.p20{width:20%}.p25{width:25%} .p30{width:30%}.p33{width:33%}.p50{width:50%}.p100{width:100%} /** 宽度 像素 **/ .w10{width:10px}.w20{width:20px}.w30{width:30px}.w40{width:40px} .w50{width:50px}.w60{width:60px}.w70{width:70px}.w80{width:80px}.w90{width:90px} .w100{width:100px}.w150{width:150px}.w200{width:200px} .w250{width:250px}.w300{width:300px}.w400{width:400px} .w500{width:500px}.w600{width:600px}.w800{width:600px} /** 高度 像素 **/ .h50{height:50px}.h100{height:100px}.h150{height:150px}.h200{height:200px}.h300{height:300px} /** 标题的样式 **/ .c10{color:#000000}.c11{color:#FF0000}.c12{color:#FFFF00} .c13{color:#00FF00}.c14{color:#00FFFF}.c15{color:#0000FF} .c16{color:#FF00FF}.c17{color:#808080}.c18{color:#C0C0C0} .c19{color:#800000}.c20{color:#808000}.c21{color:#008000} .c22{color:#008080}.c23{color:#000080}.c24{color:#800080} .b{font-weight:bold}.i{font-style:italic}.u{text-decoration:underline} /** 其他 **/ .block{display:block}.none{display:none}.red{color:red} .submit{text-align:left;margin-top:10px} .left,.right,.center,.left1,.right1,.center1{overflow:hidden;display:block;float:left;margin:0;padding:0;border:none;list-style-type:none;} .mt10{margin-top:10px}.mt5{margin-top:5px}.mt20{margin-top:20px} .ml10{margin-left:10px}.ml5{margin-left:5px}.ml20{margin-left:20px} .pr10{padding-right:10px;}
AJAX部分
/* k_ajax */ #k_ajax{position:absolute;display:block;text-align:center;top:0;left:0;z-index:900;} #k_ajax #k_ajaxBg{position:absolute;display:block;width:100%;height:100%;left:0;margin:0px;padding:0px;background:#000;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";filter:alpha(opacity=30);/*IE*/opacity:0.3;} #k_ajax #k_ajaxBox{display:block;margin:0px;border:4px solid #666;padding:0px;position:fixed;z-index:999;} #k_ajax #k_ajaxBox #k_ajaxTitle{display:table;clear:both;line-height:37px;height:37px;margin:0px;padding:0px;text-align:right;background:#F0F0F0;overflow:hidden;} #k_ajax #k_ajaxBox #k_ajaxTitle strong{font-size:14px;display:block;float:left;text-align:left;text-indent:10px;color:#F30;height:37px;} #k_ajax #k_ajaxBox #k_ajaxTitle a{font-size:10px;display:block;float:left;background:url(../images/close.gif) no-repeat 0 13px;width:50px;text-align:left;color:#FFF;text-indent:4px;height:22px;} #k_ajax #k_ajaxBox #k_ajaxTitle a:hover{color:#000;text-decoration :none;background:url(../images/close.gif) no-repeat 0 -17px;color:#FFF;} #k_ajax #k_ajaxBox #k_ajaxMain{display:block;overflow:hidden;font-size:12px;text-align:left;margin:0px;padding:0px;line-height:20px;background:#FFF;} #k_ajax #k_ajaxBox #k_ajaxMain #k_ajaxContent{display:block;} #k_ajax #k_ajaxBox #k_ajaxMain #k_ajaxContent #k_content{margin:15px;display:block;word-wrap:break-word;} #k_ajax #k_ajaxBox #k_ajaxMain table.k_tip{height:98px;font-size:14px;} #k_ajax #k_ajaxBox #k_ajaxMain table.k_tip th{width:90px;text-align:center;} #k_ajax #k_ajaxBox #k_ajaxMain table.k_tip td{text-align:left;padding-right:15px;} #k_ajax #k_ajaxBox #k_ajaxMain #k_ajaxContent .k_htm{background:none;} #k_ajax #k_ajaxBox #k_ajaxMain #k_ajaxContent .k_htm p{margin:0px;padding:0px;} #k_ajax #k_ajaxBox #k_ajaxSubmit{height:38px;clear:both;display:block;background:#F0F0F0;padding-right:5px;} #k_ajax #k_ajaxBox #k_ajaxSubmit p{display:block;float:right;padding:0px;margin:0px;height:38px;} #k_ajax #k_ajaxBox #k_ajaxSubmit p button{float:left;padding:0 3px;line-height:20px;margin:6px 0px 0px 3px;} #k_ajax #k_ajaxBox #k_ajaxSubmit p em{float:left;display:block;margin-right:10px;font-style: normal;color:#2244DD;line-height:36px;}
分页部分
/* k_pagelist 分页 */ .k_pagelist {width:100%;text-align:left;margin:0;padding:0;line-height:40px;height:40px;} .k_pagelist *{font-size:12px;padding:2px 5px;margin-left:3px;} .k_pagelist strong{background:#005CA1;color:#FFF;border:1px solid #DBDBDB;} .k_pagelist a {text-decoration:none;color:#005CA1;border:1px solid #DBDBDB;} .k_pagelist a:hover {text-decoration:none;background:#005CA1;color:#FFF;} .k_pagelist span{border:1px solid #DBDBDB;color:#999;} .k_table_form{width:100%;clear:both;margin:0px;margin-top:5px;} .k_table_form th{padding:1px 10px;background:#FFF;letter-spacing:2px;color:#14316B;line-height:30px;font-size:12px;width:90px;font-weight:normal;text-align:right;vertical-align:top;} .k_table_form tr.must th{background:url(../images/must.gif) no-repeat 98px 8px;} .k_table_form td{padding:1px 2px;line-height:30px;background:#FFF;} .k_table_form td var i{font-size:11px;color:gray;font-style:normal;margin-right:10px;font-family:Verdana;} .k_table_form tr .noborder{border-top:none;}/*去掉border-top*/ .k_table_form table.k_side td{border:none;} .k_table_form td span{display:inline;color:#000;font-size:12px;font-weight:normal;margin-right:5px;} .k_table_form td span.k_error{color:#CF0422;display:block;clear:both;line-height:15px;height:15px;font-size:12px;} .k_table_form em{margin-left:5px;color:#666;}
表单部分
/* k_table_form_ajax ajax表单 */ .k_table_form_ajax{margin:10px 0;} .k_table_form_ajax th{width:100px;text-align:right;line-height:40px;padding-right:3px;} /* k_table_list 表格列表 */ .k_table_list{width:100%;clear:both;border:1px solid #D5DFE5;} .k_table_list th{padding:0 4px;border-bottom:3px solid #CC2200;background:#F6F7F9;border-left:1px solid #FAFAFA;letter-spacing:2px;color:#555;line-height:24px;font-size:12px;white-space:nowrap;text-align:left;} .k_table_list th.c{text-align:center;} .k_table_list th.r{text-align:right;} .k_table_list td{padding:0 2px;line-height:24px;border-left:1px solid #FAFAFA;border-top:1px solid #FAFAFA;border-bottom:1px solid #FFF;word-break:break-all;background:#FFF;white-space:nowrap;overflow:hidden;} .k_table_list td blockquote.ubb {padding:5px;border:1px solid #C6C6C6;} .k_table_list * {font-size:12px;} .k_table_list tr.hover {background:#FF0000;font-weight:bold;} .k_table_list tr.hover td{background:#D0E6FE;} .k_table_list tr.hover a{font-weight:bold;} .k_table_list tr.hover td{background:#F6F9FD;border-top:1px solid #AECFF7;border-bottom:1px solid #AECFF7;border-left:1px solid #F6F9FD;} .k_table_list tr.click td{background:#EDF4FC;font-weight:bold;} .k_table_list tr td button{padding:0 3px;line-height:20px;} .k_select_auth{color:#999;} .k_select_auth label:hover{color:#555;} .k_table_list i{display:block;text-align:center;font-style:normal;}/* 居中 */ .k_table_list td b{display:block;text-align:right;font-style:normal;font-weight:normal;margin-right:5px;}/* 居右 */ .k_table_list th b{display:block;text-align:right;font-style:normal;font-weight:bold;margin-right:5px;}/* 居右 */
转载请注明出处:唯众网络