|
|
|
@ -1,66 +1,438 @@
|
|
|
|
@charset "utf-8";
|
|
|
|
/**
|
|
|
|
/* CSS Document */
|
|
|
|
* 设置CSS文档的字符集为UTF-8，确保中文等字符可以正确显示
|
|
|
|
*{font-size:9pt;border:0;margin:0;padding:0;}
|
|
|
|
*/
|
|
|
|
body{font-family:'微软雅黑'; margin:0 auto;min-width:980px;}
|
|
|
|
@charset "utf-8";
|
|
|
|
ul{display:block;margin:0;padding:0;list-style:none;}
|
|
|
|
|
|
|
|
li{display:block;margin:0;padding:0;list-style: none;}
|
|
|
|
/**
|
|
|
|
img{border:0;}
|
|
|
|
* 基础样式重置
|
|
|
|
dl,dt,dd,span{margin:0;padding:0;display:block;}
|
|
|
|
* 以下样式用于重置HTML元素的默认样式，确保在不同浏览器中的一致性
|
|
|
|
a,a:focus{text-decoration:none;color:#000;outline:none;blr:expression(this.onFocus=this.blur());}
|
|
|
|
*/
|
|
|
|
a:hover{color:#00a4ac;text-decoration:none;}
|
|
|
|
* {
|
|
|
|
table{border-collapse:collapse;border-spacing: 0;}
|
|
|
|
font-size: 9pt; /* 设置所有元素的字体大小为9pt */
|
|
|
|
cite{font-style:normal;}
|
|
|
|
border: 0; /* 移除所有元素的边框 */
|
|
|
|
h2{font-weight:normal;}
|
|
|
|
margin: 0; /* 移除所有元素的外边距 */
|
|
|
|
|
|
|
|
padding: 0; /* 移除所有元素的内边距 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
|
|
|
* 设置body元素的样式
|
|
|
|
|
|
|
|
*/
|
|
|
|
|
|
|
|
body {
|
|
|
|
|
|
|
|
font-family: '微软雅黑'; /* 设置body的字体为微软雅黑 */
|
|
|
|
|
|
|
|
margin: 0 auto; /* 水平居中body元素 */
|
|
|
|
|
|
|
|
min-width: 980px; /* 设置body的最小宽度为980px */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
|
|
|
* 设置无序列表ul的样式
|
|
|
|
|
|
|
|
*/
|
|
|
|
|
|
|
|
ul {
|
|
|
|
|
|
|
|
display: block; /* 将ul设置为块级元素 */
|
|
|
|
|
|
|
|
margin: 0; /* 移除ul的外边距 */
|
|
|
|
|
|
|
|
padding: 0; /* 移除ul的内边距 */
|
|
|
|
|
|
|
|
list-style: none; /* 移除ul的项目符号 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
|
|
|
* 设置列表项li的样式
|
|
|
|
|
|
|
|
*/
|
|
|
|
|
|
|
|
li {
|
|
|
|
|
|
|
|
display: block; /* 将li设置为块级元素 */
|
|
|
|
|
|
|
|
margin: 0; /* 移除li的外边距 */
|
|
|
|
|
|
|
|
padding: 0; /* 移除li的内边距 */
|
|
|
|
|
|
|
|
list-style: none; /* 移除li的项目符号 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
|
|
|
* 设置图片img的样式
|
|
|
|
|
|
|
|
*/
|
|
|
|
|
|
|
|
img {
|
|
|
|
|
|
|
|
border: 0; /* 移除图片的边框 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
|
|
|
* 设置定义列表dl、dt、dd和span的样式
|
|
|
|
|
|
|
|
*/
|
|
|
|
|
|
|
|
dl, dt, dd, span {
|
|
|
|
|
|
|
|
margin: 0; /* 移除这些元素的外边距 */
|
|
|
|
|
|
|
|
padding: 0; /* 移除这些元素的内边距 */
|
|
|
|
|
|
|
|
display: block; /* 将这些元素设置为块级元素 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
|
|
|
* 设置链接a的样式
|
|
|
|
|
|
|
|
*/
|
|
|
|
|
|
|
|
a, a:focus {
|
|
|
|
|
|
|
|
text-decoration: none; /* 移除链接的下划线 */
|
|
|
|
|
|
|
|
color: #000; /* 设置链接的颜色为黑色 */
|
|
|
|
|
|
|
|
outline: none; /* 移除聚焦时的轮廓线 */
|
|
|
|
|
|
|
|
blr: expression(this.onFocus=this.blur()); /* IE浏览器中移除聚焦时的虚线框 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
|
|
|
* 设置链接a在鼠标悬停时的样式
|
|
|
|
|
|
|
|
*/
|
|
|
|
|
|
|
|
a:hover {
|
|
|
|
|
|
|
|
color: #00a4ac; /* 鼠标悬停时改变链接颜色为#00a4ac */
|
|
|
|
|
|
|
|
text-decoration: none; /* 鼠标悬停时保持无下划线 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
|
|
|
* 设置表格table的样式
|
|
|
|
|
|
|
|
*/
|
|
|
|
|
|
|
|
table {
|
|
|
|
|
|
|
|
border-collapse: collapse; /* 合并表格边框 */
|
|
|
|
|
|
|
|
border-spacing: 0; /* 移除表格边框间隔 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
|
|
|
* 设置引用cite的样式
|
|
|
|
|
|
|
|
*/
|
|
|
|
|
|
|
|
cite {
|
|
|
|
|
|
|
|
font-style: normal; /* 将引用的字体样式设置为正常 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
|
|
|
* 设置标题h2的样式
|
|
|
|
|
|
|
|
*/
|
|
|
|
|
|
|
|
h2 {
|
|
|
|
|
|
|
|
font-weight: normal; /* 将h2的字体粗细设置为正常 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/*cloud*/
|
|
|
|
/*cloud*/
|
|
|
|
|
|
|
|
|
|
|
|
#mainBody {width:100%;height:100%;position:absolute;z-index:-1;}
|
|
|
|
/**
|
|
|
|
.cloud {position:absolute;top:0px;left:0px;width:100%;height:100%;background:url(../images/cloud.png) no-repeat;z-index:1;opacity:0.5;}
|
|
|
|
* 设置主容器mainBody的样式
|
|
|
|
#cloud2 {z-index:2;}
|
|
|
|
*/
|
|
|
|
|
|
|
|
#mainBody {
|
|
|
|
|
|
|
|
width: 100%; /* 容器宽度占满整个视口 */
|
|
|
|
|
|
|
|
height: 100%; /* 容器高度占满整个视口 */
|
|
|
|
|
|
|
|
position: absolute; /* 容器定位方式为绝对定位 */
|
|
|
|
|
|
|
|
z-index: -1; /* 容器的堆叠顺序，-1表示在大多数元素下方 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
|
|
|
* 设置云朵背景样式
|
|
|
|
|
|
|
|
*/
|
|
|
|
|
|
|
|
.cloud {
|
|
|
|
|
|
|
|
position: absolute; /* 定位方式为绝对定位 */
|
|
|
|
|
|
|
|
top: 0px; /* 距离顶部0像素 */
|
|
|
|
|
|
|
|
left: 0px; /* 距离左侧0像素 */
|
|
|
|
|
|
|
|
width: 100%; /* 宽度占满整个视口 */
|
|
|
|
|
|
|
|
height: 100%; /* 高度占满整个视口 */
|
|
|
|
|
|
|
|
background: url(../images/cloud.png) no-repeat; /* 设置背景图片，不重复 */
|
|
|
|
|
|
|
|
z-index: 1; /* 堆叠顺序为1，表示在mainBody之上 */
|
|
|
|
|
|
|
|
opacity: 0.5; /* 设置透明度为50% */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
|
|
|
* 设置第二个云朵背景样式，用于覆盖第一个云朵，实现层次效果
|
|
|
|
|
|
|
|
*/
|
|
|
|
|
|
|
|
#cloud2 {
|
|
|
|
|
|
|
|
z-index: 2; /* 堆叠顺序为2，表示在#cloud之上 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/*login*/
|
|
|
|
/*login*/
|
|
|
|
.logintop{height:47px; position:absolute; top:0; background:url(../images/loginbg1.png) repeat-x;z-index:100; width:100%;}
|
|
|
|
/* 定义登录页面的顶部样式 */
|
|
|
|
.logintop span{color:#fff; line-height:47px; background:url(../images/loginsj.png) no-repeat 21px 18px; text-indent:44px; color:#afc5d2; float:left;}
|
|
|
|
.logintop {
|
|
|
|
.logintop ul{float:right; padding-right:30px;}
|
|
|
|
height: 47px; /* 高度为47像素 */
|
|
|
|
.logintop ul li{float:left; margin-left:20px; line-height:47px;}
|
|
|
|
position: absolute; /* 定位方式为绝对定位 */
|
|
|
|
.logintop ul li a{color:#afc5d2;}
|
|
|
|
top: 0; /* 距离顶部0像素 */
|
|
|
|
.logintop ul li a:hover{color:#fff;}
|
|
|
|
background: url(../images/loginbg1.png) repeat-x; /* 设置背景图片，水平重复 */
|
|
|
|
.loginbody{background:url(../images/loginbg3.png) no-repeat center center; width:100%; height:585px; overflow:hidden; position:absolute; top:47px;}
|
|
|
|
z-index: 100; /* 堆叠顺序为100，确保在最上方 */
|
|
|
|
.systemlogo{background:url(../images/loginlogo.png) no-repeat center;width:100%; height:71px; margin-top:75px;}
|
|
|
|
width: 100%; /* 宽度占满整个视口 */
|
|
|
|
.loginbox{width:692px; height:336px; background:url(../images/logininfo.png) no-repeat; margin-top:30px;}
|
|
|
|
}
|
|
|
|
.loginbox ul{margin-top:88px; margin-left:285px;}
|
|
|
|
|
|
|
|
.loginbox ul li{margin-bottom:25px;}
|
|
|
|
/* 定义.logintop内的span元素样式 */
|
|
|
|
.loginbox ul li label{color:#687f92; padding-left:25px;}
|
|
|
|
.logintop span {
|
|
|
|
.loginbox ul li label a{color:#687f92;}
|
|
|
|
color: #fff; /* 文字颜色为白色 */
|
|
|
|
.loginbox ul li label a:hover{color:#3d96c9;}
|
|
|
|
line-height: 47px; /* 行高与.logintop高度相同，实现垂直居中 */
|
|
|
|
.loginbox ul li label input{margin-right:5px;}
|
|
|
|
background: url(../images/loginsj.png) no-repeat 21px 18px; /* 设置背景图片，不重复，并定位 */
|
|
|
|
.loginbox,.loginbox1,.loginbox2,.loginbox3,.loginbox4{width:692px; height:373px;margin-top:30px;}
|
|
|
|
text-indent: 44px; /* 文本缩进，为背景图片留出空间 */
|
|
|
|
.loginuser{width:299px; height:48px; background:url(../images/loginuser.png) no-repeat; border:none; line-height:48px; padding-left:44px; font-size:14px; font-weight:bold;}
|
|
|
|
color: #afc5d2; /* 文字颜色为浅蓝色 */
|
|
|
|
.loginpwd{width:299px; height:48px; background:url(../images/loginpassword.png) no-repeat; border:none;line-height:48px; padding-left:44px; font-size:14px; color:#90a2bc;}
|
|
|
|
float: left; /* 向左浮动 */
|
|
|
|
.loginbtn{width:111px;height:35px; background:url(../images/buttonbg.png) repeat-x; font-size:14px; font-weight:bold; color:#fff;cursor:pointer; line-height:35px;}
|
|
|
|
}
|
|
|
|
.loginbm{height:50px; line-height:50px; text-align:center; background:url(../images/loginbg2.png) repeat-x;position:absolute; bottom:0; width:100%; color:#0b3a58;}
|
|
|
|
|
|
|
|
.loginbm a{font-weight:bold;color:#0b3a58;}
|
|
|
|
/* 定义.logintop内的ul元素样式 */
|
|
|
|
.loginbm a:hover{color:#fff;}
|
|
|
|
.logintop ul {
|
|
|
|
|
|
|
|
float: right; /* 向右浮动 */
|
|
|
|
.loginbox1{background:url(../images/logininfo1.png) no-repeat;}
|
|
|
|
padding-right: 30px; /* 右侧内边距为30像素 */
|
|
|
|
.loginbox1 ul li{margin-bottom:16px;}
|
|
|
|
}
|
|
|
|
.loginbox2{background:url(../images/logininfo2.png) no-repeat;}
|
|
|
|
|
|
|
|
.loginbox2 ul li{margin-bottom:16px;}
|
|
|
|
/* 定义.logintop内的li元素样式 */
|
|
|
|
.loginbox3{background:url(../images/logininfo3.png) no-repeat;}
|
|
|
|
.logintop ul li {
|
|
|
|
.loginbox3 ul li{margin-bottom:16px;}
|
|
|
|
float: left; /* 向左浮动 */
|
|
|
|
.yzm{width:341px; height:46px; background:url(../images/yzmbg.png) no-repeat; padding-bottom:5px;}
|
|
|
|
margin-left: 20px; /* 左侧外边距为20像素 */
|
|
|
|
.yzm span{display:block; float:left;width:227px; height:46px;}
|
|
|
|
line-height: 47px; /* 行高与.logintop高度相同，实现垂直居中 */
|
|
|
|
.yzm span input{background:none; border:none; width:183px; height:46px; line-height:46px;padding-left:44px;font-size:14px; color:#cee4f1;}
|
|
|
|
}
|
|
|
|
.yzm cite{float:right; width:114px; height:46px; line-height:46px; font-size:18px; color:#fff; text-align:center;}
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义.logintop内的a元素样式 */
|
|
|
|
.loginbody1{background:url(../images/loginbg4.png) no-repeat center center; width:100%; height:585px; overflow:hidden; position:absolute; top:47px;}
|
|
|
|
.logintop ul li a {
|
|
|
|
.systemlogo{width:100%; height:71px; margin-top:120px; text-align:center;}
|
|
|
|
color: #afc5d2; /* 文字颜色为浅蓝色 */
|
|
|
|
.loginbox0{width:810px;margin-top:0px;height:252px;}
|
|
|
|
}
|
|
|
|
.loginlist{width:810px; overflow:hidden;}
|
|
|
|
|
|
|
|
.loginlist{margin-top:110px;}
|
|
|
|
/* 定义.logintop内的a元素鼠标悬停时的样式 */
|
|
|
|
.loginlist li{float:left; margin-left:3px; margin-right:3px;}
|
|
|
|
.logintop ul li a:hover {
|
|
|
|
.loginlist li a{ display:block;width:196px; height:252px; background:url(../images/lbg.png) no-repeat; text-align:center; padding-top:25px; cursor:pointer;}
|
|
|
|
color: #fff; /* 文字颜色变为白色 */
|
|
|
|
.loginlist li a:hover{background:url(../images/lbg1.png) no-repeat;}
|
|
|
|
}
|
|
|
|
.loginlist li a p{font-size:16px; color:#fff; padding-top:10px;}
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义登录页面的主体样式 */
|
|
|
|
|
|
|
|
.loginbody {
|
|
|
|
|
|
|
|
background: url(../images/loginbg3.png) no-repeat center center; /* 设置背景图片，不重复，并居中 */
|
|
|
|
|
|
|
|
width: 100%; /* 宽度占满整个视口 */
|
|
|
|
|
|
|
|
height: 585px; /* 高度为585像素 */
|
|
|
|
|
|
|
|
overflow: hidden; /* 隐藏溢出的内容 */
|
|
|
|
|
|
|
|
position: absolute; /* 定位方式为绝对定位 */
|
|
|
|
|
|
|
|
top: 47px; /* 距离顶部47像素，与.logintop高度相同 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义系统logo样式 */
|
|
|
|
|
|
|
|
.systemlogo {
|
|
|
|
|
|
|
|
background: url(../images/loginlogo.png) no-repeat center; /* 设置背景图片，不重复，并居中 */
|
|
|
|
|
|
|
|
width: 100%; /* 宽度占满整个视口 */
|
|
|
|
|
|
|
|
height: 71px; /* 高度为71像素 */
|
|
|
|
|
|
|
|
margin-top: 75px; /* 上外边距为75像素 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义登录框基础样式 */
|
|
|
|
|
|
|
|
.loginbox {
|
|
|
|
|
|
|
|
width: 692px; /* 宽度为692像素 */
|
|
|
|
|
|
|
|
height: 336px; /* 高度为336像素 */
|
|
|
|
|
|
|
|
background: url(../images/logininfo.png) no-repeat; /* 设置背景图片，不重复 */
|
|
|
|
|
|
|
|
margin-top: 30px; /* 上外边距为30像素 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义.loginbox内的ul元素样式 */
|
|
|
|
|
|
|
|
.loginbox ul {
|
|
|
|
|
|
|
|
margin-top: 88px; /* 上外边距为88像素 */
|
|
|
|
|
|
|
|
margin-left: 285px; /* 左外边距为285像素 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义.loginbox内的li元素样式 */
|
|
|
|
|
|
|
|
.loginbox ul li {
|
|
|
|
|
|
|
|
margin-bottom: 25px; /* 底部外边距为25像素 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义.loginbox内的label元素样式 */
|
|
|
|
|
|
|
|
.loginbox ul li label {
|
|
|
|
|
|
|
|
color: #687f92; /* 文字颜色为深蓝色 */
|
|
|
|
|
|
|
|
padding-left: 25px; /* 左内边距为25像素 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义.loginbox内的label内的a元素样式 */
|
|
|
|
|
|
|
|
.loginbox ul li label a {
|
|
|
|
|
|
|
|
color: #687f92; /* 文字颜色为深蓝色 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义.loginbox内的label内的a元素鼠标悬停时的样式 */
|
|
|
|
|
|
|
|
.loginbox ul li label a:hover {
|
|
|
|
|
|
|
|
color: #3d96c9; /* 文字颜色变为浅蓝色 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义.loginbox内的input元素样式 */
|
|
|
|
|
|
|
|
.loginbox ul li label input {
|
|
|
|
|
|
|
|
margin-right: 5px; /* 右外边距为5像素 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
/* 定义.loginbox, .loginbox1, .loginbox2, .loginbox3, .loginbox4共有的样式 */
|
|
|
|
|
|
|
|
.loginbox, .loginbox1, .loginbox2, .loginbox3, .loginbox4 {
|
|
|
|
|
|
|
|
width: 692px; /* 设置宽度为692像素 */
|
|
|
|
|
|
|
|
height: 373px; /* 设置高度为373像素 */
|
|
|
|
|
|
|
|
margin-top: 30px; /* 设置顶部外边距为30像素 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义输入用户名的输入框样式 */
|
|
|
|
|
|
|
|
.loginuser {
|
|
|
|
|
|
|
|
width: 299px; /* 设置宽度为299像素 */
|
|
|
|
|
|
|
|
height: 48px; /* 设置高度为48像素 */
|
|
|
|
|
|
|
|
background: url(../images/loginuser.png) no-repeat; /* 设置背景图片，不重复 */
|
|
|
|
|
|
|
|
border: none; /* 去除边框 */
|
|
|
|
|
|
|
|
line-height: 48px; /* 设置行高与高度相同，实现垂直居中 */
|
|
|
|
|
|
|
|
padding-left: 44px; /* 设置左侧内边距为44像素，为背景图片留出空间 */
|
|
|
|
|
|
|
|
font-size: 14px; /* 设置字体大小为14像素 */
|
|
|
|
|
|
|
|
font-weight: bold; /* 设置字体加粗 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义输入密码的输入框样式 */
|
|
|
|
|
|
|
|
.loginpwd {
|
|
|
|
|
|
|
|
width: 299px; /* 设置宽度为299像素 */
|
|
|
|
|
|
|
|
height: 48px; /* 设置高度为48像素 */
|
|
|
|
|
|
|
|
background: url(../images/loginpassword.png) no-repeat; /* 设置背景图片，不重复 */
|
|
|
|
|
|
|
|
border: none; /* 去除边框 */
|
|
|
|
|
|
|
|
line-height: 48px; /* 设置行高与高度相同，实现垂直居中 */
|
|
|
|
|
|
|
|
padding-left: 44px; /* 设置左侧内边距为44像素，为背景图片留出空间 */
|
|
|
|
|
|
|
|
font-size: 14px; /* 设置字体大小为14像素 */
|
|
|
|
|
|
|
|
color: #90a2bc; /* 设置字体颜色为浅蓝色 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义登录按钮样式 */
|
|
|
|
|
|
|
|
.loginbtn {
|
|
|
|
|
|
|
|
width: 111px; /* 设置宽度为111像素 */
|
|
|
|
|
|
|
|
height: 35px; /* 设置高度为35像素 */
|
|
|
|
|
|
|
|
background: url(../images/buttonbg.png) repeat-x; /* 设置背景图片，水平重复 */
|
|
|
|
|
|
|
|
font-size: 14px; /* 设置字体大小为14像素 */
|
|
|
|
|
|
|
|
font-weight: bold; /* 设置字体加粗 */
|
|
|
|
|
|
|
|
color: #fff; /* 设置字体颜色为白色 */
|
|
|
|
|
|
|
|
cursor: pointer; /* 设置鼠标样式为指针，表示可点击 */
|
|
|
|
|
|
|
|
line-height: 35px; /* 设置行高与高度相同，实现垂直居中 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义页面底部样式 */
|
|
|
|
|
|
|
|
.loginbm {
|
|
|
|
|
|
|
|
height: 50px; /* 设置高度为50像素 */
|
|
|
|
|
|
|
|
line-height: 50px; /* 设置行高与高度相同，实现垂直居中 */
|
|
|
|
|
|
|
|
text-align: center; /* 设置文本居中对齐 */
|
|
|
|
|
|
|
|
background: url(../images/loginbg2.png) repeat-x; /* 设置背景图片，水平重复 */
|
|
|
|
|
|
|
|
position: absolute; /* 定位方式为绝对定位 */
|
|
|
|
|
|
|
|
bottom: 0; /* 距离底部0像素 */
|
|
|
|
|
|
|
|
width: 100%; /* 宽度占满整个视口 */
|
|
|
|
|
|
|
|
color: #0b3a58; /* 设置字体颜色为深蓝色 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义.loginbm内的a元素样式 */
|
|
|
|
|
|
|
|
.loginbm a {
|
|
|
|
|
|
|
|
font-weight: bold; /* 设置字体加粗 */
|
|
|
|
|
|
|
|
color: #0b3a58; /* 设置字体颜色为深蓝色 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义.loginbm内的a元素鼠标悬停时的样式 */
|
|
|
|
|
|
|
|
.loginbm a:hover {
|
|
|
|
|
|
|
|
color: #fff; /* 设置字体颜色为白色 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义.loginbox1的样式 */
|
|
|
|
|
|
|
|
.loginbox1 {
|
|
|
|
|
|
|
|
background: url(../images/logininfo1.png) no-repeat; /* 设置背景图片，不重复 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义.loginbox1中ul元素下的li元素的样式 */
|
|
|
|
|
|
|
|
.loginbox1 ul li {
|
|
|
|
|
|
|
|
margin-bottom: 16px; /* 设置底部外边距为16像素，为列表项之间提供间隔 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义.loginbox2的样式 */
|
|
|
|
|
|
|
|
.loginbox2 {
|
|
|
|
|
|
|
|
background: url(../images/logininfo2.png) no-repeat; /* 设置背景图片，不重复 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义.loginbox2中ul元素下的li元素的样式 */
|
|
|
|
|
|
|
|
.loginbox2 ul li {
|
|
|
|
|
|
|
|
margin-bottom: 16px; /* 设置底部外边距为16像素，为列表项之间提供间隔 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义.loginbox3的样式 */
|
|
|
|
|
|
|
|
.loginbox3 {
|
|
|
|
|
|
|
|
background: url(../images/logininfo3.png) no-repeat; /* 设置背景图片，不重复 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义.loginbox3中ul元素下的li元素的样式 */
|
|
|
|
|
|
|
|
.loginbox3 ul li {
|
|
|
|
|
|
|
|
margin-bottom: 16px; /* 设置底部外边距为16像素，为列表项之间提供间隔 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义验证码输入框容器的样式 */
|
|
|
|
|
|
|
|
.yzm {
|
|
|
|
|
|
|
|
width: 341px; /* 设置宽度为341像素 */
|
|
|
|
|
|
|
|
height: 46px; /* 设置高度为46像素 */
|
|
|
|
|
|
|
|
background: url(../images/yzmbg.png) no-repeat; /* 设置背景图片，不重复 */
|
|
|
|
|
|
|
|
padding-bottom: 5px; /* 设置底部内边距为5像素 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义验证码输入框内部span元素的样式 */
|
|
|
|
|
|
|
|
.yzm span {
|
|
|
|
|
|
|
|
display: block; /* 将span元素设置为块级元素 */
|
|
|
|
|
|
|
|
float: left; /* 使span元素左浮动 */
|
|
|
|
|
|
|
|
width: 227px; /* 设置宽度为227像素 */
|
|
|
|
|
|
|
|
height: 46px; /* 设置高度为46像素 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义验证码输入框内部input元素的样式 */
|
|
|
|
|
|
|
|
.yzm span input {
|
|
|
|
|
|
|
|
background: none; /* 移除背景 */
|
|
|
|
|
|
|
|
border: none; /* 移除边框 */
|
|
|
|
|
|
|
|
width: 183px; /* 设置宽度为183像素 */
|
|
|
|
|
|
|
|
height: 46px; /* 设置高度为46像素 */
|
|
|
|
|
|
|
|
line-height: 46px; /* 设置行高为46像素，使文本垂直居中 */
|
|
|
|
|
|
|
|
padding-left: 44px; /* 设置左侧内边距为44像素，为输入文本提供空间 */
|
|
|
|
|
|
|
|
font-size: 14px; /* 设置字体大小为14像素 */
|
|
|
|
|
|
|
|
color: #cee4f1; /* 设置字体颜色为浅蓝色 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义验证码显示区域cite元素的样式 */
|
|
|
|
|
|
|
|
.yzm cite {
|
|
|
|
|
|
|
|
float: right; /* 使cite元素右浮动 */
|
|
|
|
|
|
|
|
width: 114px; /* 设置宽度为114像素 */
|
|
|
|
|
|
|
|
height: 46px; /* 设置高度为46像素 */
|
|
|
|
|
|
|
|
line-height: 46px; /* 设置行高为46像素，使文本垂直居中 */
|
|
|
|
|
|
|
|
font-size: 18px; /* 设置字体大小为18像素 */
|
|
|
|
|
|
|
|
color: #fff; /* 设置字体颜色为白色 */
|
|
|
|
|
|
|
|
text-align: center; /* 设置文本居中对齐 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义登录页面的主体样式，背景图片居中且不重复 */
|
|
|
|
|
|
|
|
.loginbody1 {
|
|
|
|
|
|
|
|
background: url(../images/loginbg4.png) no-repeat center center; /* 设置背景图片，不重复，并使其水平和垂直居中 */
|
|
|
|
|
|
|
|
width: 100%; /* 设置宽度为100% */
|
|
|
|
|
|
|
|
height: 585px; /* 设置高度为585像素 */
|
|
|
|
|
|
|
|
overflow: hidden; /* 隐藏超出容器的内容 */
|
|
|
|
|
|
|
|
position: absolute; /* 定位方式为绝对定位 */
|
|
|
|
|
|
|
|
top: 47px; /* 距离顶部47像素 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义系统logo的样式 */
|
|
|
|
|
|
|
|
.systemlogo {
|
|
|
|
|
|
|
|
width: 100%; /* 设置宽度为100% */
|
|
|
|
|
|
|
|
height: 71px; /* 设置高度为71像素 */
|
|
|
|
|
|
|
|
margin-top: 120px; /* 设置顶部外边距为120像素 */
|
|
|
|
|
|
|
|
text-align: center; /* 设置文本居中对齐 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义登录框的样式 */
|
|
|
|
|
|
|
|
.loginbox0 {
|
|
|
|
|
|
|
|
width: 810px; /* 设置宽度为810像素 */
|
|
|
|
|
|
|
|
margin-top: 0px; /* 设置顶部外边距为0像素 */
|
|
|
|
|
|
|
|
height: 252px; /* 设置高度为252像素 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义登录列表的样式 */
|
|
|
|
|
|
|
|
.loginlist {
|
|
|
|
|
|
|
|
width: 810px; /* 设置宽度为810像素 */
|
|
|
|
|
|
|
|
overflow: hidden; /* 隐藏超出容器的内容 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义登录列表的顶部外边距 */
|
|
|
|
|
|
|
|
.loginlist {
|
|
|
|
|
|
|
|
margin-top: 110px; /* 设置顶部外边距为110像素 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义登录列表中列表项的样式 */
|
|
|
|
|
|
|
|
.loginlist li {
|
|
|
|
|
|
|
|
float: left; /* 使列表项左浮动，以便水平排列 */
|
|
|
|
|
|
|
|
margin-left: 3px; /* 设置左侧外边距为3像素，为列表项之间提供间隔 */
|
|
|
|
|
|
|
|
margin-right: 3px; /* 设置右侧外边距为3像素，为列表项之间提供间隔 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义登录列表中列表项内链接的样式 */
|
|
|
|
|
|
|
|
.loginlist li a {
|
|
|
|
|
|
|
|
display: block; /* 将链接设置为块级元素，使其可以设置宽高 */
|
|
|
|
|
|
|
|
width: 196px; /* 设置链接的宽度为196像素 */
|
|
|
|
|
|
|
|
height: 252px; /* 设置链接的高度为252像素 */
|
|
|
|
|
|
|
|
background: url(../images/lbg.png) no-repeat; /* 设置背景图片，不重复 */
|
|
|
|
|
|
|
|
text-align: center; /* 设置文本居中对齐 */
|
|
|
|
|
|
|
|
padding-top: 25px; /* 设置顶部内边距为25像素，为内容提供空间 */
|
|
|
|
|
|
|
|
cursor: pointer; /* 设置鼠标悬停时为手形指针 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义登录列表中列表项内链接鼠标悬停时的样式 */
|
|
|
|
|
|
|
|
.loginlist li a:hover {
|
|
|
|
|
|
|
|
background: url(../images/lbg1.png) no-repeat; /* 当鼠标悬停时，改变背景图片 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 定义登录列表中列表项内链接中的段落样式 */
|
|
|
|
|
|
|
|
.loginlist li a p {
|
|
|
|
|
|
|
|
font-size: 16px; /* 设置字体大小为16像素 */
|
|
|
|
|
|
|
|
color: #fff; /* 设置字体颜色为白色 */
|
|
|
|
|
|
|
|
padding-top: 10px; /* 设置顶部内边距为10像素，为段落内容提供空间 */
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
