You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
220 lines
12 KiB
220 lines
12 KiB
|
|
/*框架结构*/
|
|
.header{ background:#155ED7; height:93px; position:fixed; top:0px; left:0px; width:100%; z-index:3;}
|
|
.box-left{ background:#037BE9; width:92px; position:fixed; top:93px; left:0px; z-index:3; overflow-y:auto;}
|
|
.box-content{ background:#fff; margin-top:108px;margin-left:107px; margin-right:15px; overflow:auto;}
|
|
.box-contentsy{ background:#fff; margin-top:108px; overflow:auto;}
|
|
.biaoqian{ background:#EEEEEE; border-bottom:2px solid #1576D7;}
|
|
.box-button{ background:#E3EAF2; padding:10px;}
|
|
|
|
|
|
|
|
|
|
/*---头部----*/
|
|
.header .logo{ padding-top:20px; padding-left:20px;}
|
|
.header .nav{ margin-left:30px; }
|
|
.header .nav li{ float:left; margin-left:2px;}
|
|
.header .nav li a{ display:block; height:70px; width:104px; margin-top:8px; padding-top:15px;}
|
|
.header .nav li a .icon{ display:block; margin:0px auto;margin-bottom:3px;}
|
|
.header .nav li a p{ color:#fff; font-size:16px; font-weight: normal; text-align:center;}
|
|
.header .nav li a:hover{ background:#1251BA;}
|
|
.header .nav li .on,.header .nav li .on:hover{ background:url(../img/nav-on.jpg) repeat;}
|
|
|
|
.navigation{ position:fixed; right:10px; top:20px; z-index:6;}
|
|
.navigation .yhm a{ display:block; padding:10px; height:30px; background:#1252BC;}
|
|
.navigation .yhm a .icon{ display:block; float:left; margin:0px auto;margin-right:5px;}
|
|
.navigation .yhm a p{ float:left; color:#fff; height:30px; line-height:30px;}
|
|
.navigation .xiala{ margin-top:10px; display:none;}
|
|
.navigation .xiala .sanjiao-lan{ display:block;margin-left:125px; width:11px; height:6px;}
|
|
.navigation .xiala .xllb{ background:#037BE9; width:100%; border-top:1px solid #037BE9; border-bottom:1px solid #037BE9;}
|
|
.navigation .xiala .xllb li{ margin:1px 2px;}
|
|
.navigation .xiala .xllb li a{ display:block; padding:10px; background:#037BE9; color:#fff; }
|
|
.navigation .xiala .xllb li a p{float:left; color:#fff;}
|
|
.navigation .xiala .xllb li a:hover{ background:#015EC5;}
|
|
.navigation .yhm a{ display:block; padding:10px; height:30px; background:#1252BC;}
|
|
.navigation .xiala .xllb li a .icon{ display:block; float:left; margin:0px auto;margin-right:5px; height:20px; }
|
|
|
|
.caidan li{border-bottom:1px solid #135AD0; position:relative;}
|
|
.caidan li a{ display:block; padding:15px 0px; text-align:center;}
|
|
.caidan li a .icon{ display:block; margin:0px auto;margin-bottom:3px;}
|
|
.caidan li a p{ color:#fff; font-size:14px; font-weight:normal;}
|
|
.caidan li a:hover{ background:#1048A7;}
|
|
.caidan li.on{ background:#1048A7;}
|
|
|
|
.product{width:116px;background:#1048A7; padding:0px 10px; padding-left:15px; display:none; height:624px;overflow:auto;}
|
|
.product-wrap{ position: fixed; left:92px; top:93px; z-index:100; background:#1048A7; padding:15px 0px; padding-top:25px;}
|
|
.product-wrap .show{ display: block;}
|
|
.product a{ background:url(../img/quan.png) no-repeat left center; display:block; line-height:30px; font-size:14px; text-align:left; color:#BBDAF9; padding:0; padding-left:20px;}
|
|
.product a:hover{ background:url(../img/yuan.png) no-repeat left center; color:#FFFF00;}
|
|
|
|
.product .close{ position:absolute; top:10px; right:15px; background:none;}
|
|
.product .close:hover{ background:none;}
|
|
|
|
|
|
/*========================================内容部分=====================================*/
|
|
.nr{ padding:20px;}
|
|
.nr-nry{ padding:10px 0px;}
|
|
.nr-nry .box{ margin:0px 10px; margin-bottom:15px;}
|
|
.box{ border:1px solid #dfdfdf; background:#fff; margin-bottom:15px;}
|
|
|
|
|
|
/*------首页-------*/
|
|
|
|
.dsj{ margin-bottom:15px;}
|
|
.ldsj{ padding:10px 15px; background:#fff;}
|
|
|
|
.lzsj-lv{ margin-right:8px;}
|
|
.lzsj-lv h3{ font-size:30px; font-weight:bold; color:#fff; padding:15px 0px; text-align:center; text-shadow:0px 1px 2px rgba(0,0,0,0.4); background:#4DCA78;}
|
|
|
|
.lzsj-lan{ margin-left:8px;}
|
|
.lzsj-lan h3{ font-size:30px; font-weight:bold; color:#fff; padding:15px 0px; text-align:center; text-shadow:0px 1px 2px rgba(0,0,0,0.4); background:#36AAEF;}
|
|
|
|
/*数字滚动插件的CSS可调整样式*/
|
|
.mt-number-animate{ font-family: '微软雅黑'; line-height:85px; height:85px;/*设置数字显示高度*/; font-size: 36px;/*设置数字大小*/ overflow: hidden; display: inline-block; position: relative; }
|
|
.mt-number-animate .mt-number-animate-dot{ width: 15px;/*设置分割符宽度*/ line-height: 85px; float: left; text-align: center;}
|
|
.mt-number-animate .mt-number-animate-dom{ width:10%;/*设置单个数字宽度*/ text-align: center; float: left; position: relative; top: 0;}
|
|
.mt-number-animate .mt-number-animate-dom .mt-number-animate-span{ width: 100%; float: left; display:block; border-left:1px solid #fff; border-right:1px solid #fff;}
|
|
.mt-number-animate-span strong{display:block; width:39px; height:70px; margin:8px auto;}
|
|
|
|
.lzsj-lv .mt-number-animate .mt-number-animate-dom .mt-number-animate-span{background:#E9EFEB;}
|
|
.lzsj-lv .mt-number-animate-span .sz-0 {background:url(../img/sz-0.png) no-repeat;}
|
|
.lzsj-lv .mt-number-animate-span .sz-1 {background:url(../img/sz-1.png) no-repeat;}
|
|
.lzsj-lv .mt-number-animate-span .sz-2 {background:url(../img/sz-2.png) no-repeat;}
|
|
.lzsj-lv .mt-number-animate-span .sz-3 {background:url(../img/sz-3.png) no-repeat;}
|
|
.lzsj-lv .mt-number-animate-span .sz-4 {background:url(../img/sz-4.png) no-repeat;}
|
|
.lzsj-lv .mt-number-animate-span .sz-5 {background:url(../img/sz-5.png) no-repeat;}
|
|
.lzsj-lv .mt-number-animate-span .sz-6 {background:url(../img/sz-6.png) no-repeat;}
|
|
.lzsj-lv .mt-number-animate-span .sz-7 {background:url(../img/sz-7.png) no-repeat;}
|
|
.lzsj-lv .mt-number-animate-span .sz-8 {background:url(../img/sz-8.png) no-repeat;}
|
|
.lzsj-lv .mt-number-animate-span .sz-9 {background:url(../img/sz-9.png) no-repeat;}
|
|
|
|
.lzsj-lan .mt-number-animate .mt-number-animate-dom .mt-number-animate-span{background:#E9ECED;}
|
|
.lzsj-lan .mt-number-animate-span .sz-0 {background:url(../img/sz-0-lan.png) no-repeat;}
|
|
.lzsj-lan .mt-number-animate-span .sz-1 {background:url(../img/sz-1-lan.png) no-repeat;}
|
|
.lzsj-lan .mt-number-animate-span .sz-2 {background:url(../img/sz-2-lan.png) no-repeat;}
|
|
.lzsj-lan .mt-number-animate-span .sz-3 {background:url(../img/sz-3-lan.png) no-repeat;}
|
|
.lzsj-lan .mt-number-animate-span .sz-4 {background:url(../img/sz-4-lan.png) no-repeat;}
|
|
.lzsj-lan .mt-number-animate-span .sz-5 {background:url(../img/sz-5-lan.png) no-repeat;}
|
|
.lzsj-lan .mt-number-animate-span .sz-6 {background:url(../img/sz-6-lan.png) no-repeat;}
|
|
.lzsj-lan .mt-number-animate-span .sz-7 {background:url(../img/sz-7-lan.png) no-repeat;}
|
|
.lzsj-lan .mt-number-animate-span .sz-8 {background:url(../img/sz-8-lan.png) no-repeat;}
|
|
.lzsj-lan .mt-number-animate-span .sz-9 {background:url(../img/sz-9-lan.png) no-repeat;}
|
|
|
|
.lzsj{ margin:15px 10px; border:1px solid #eee;}
|
|
.lzsj h3{ font-size:18px; font-weight: normal; color:#444; padding:7px 0px; text-align:center;/* text-shadow:0px 1px 2px rgba(0,0,0,0.4);*/border-bottom:1px solid #eee; }
|
|
.lzsj .h3-lan{ font-size:20px; font-weight:bold; color:#fff; padding:15px 0px; text-align:center; text-shadow:0px 1px 2px rgba(0,0,0,0.4); background:#4DCA78;}
|
|
.lzsj .h3-lv{ font-size:20px; font-weight:bold; color:#fff; padding:15px 0px; text-align:center; text-shadow:0px 1px 2px rgba(0,0,0,0.4); background:#36AAEF;}
|
|
.shuz{ margin:10px;}
|
|
.shuz .mt-number-animate{ font-family: '微软雅黑'; line-height:50px; height:50px;/*设置数字显示高度*/; font-size:25px;/*设置数字大小*/ overflow: hidden; text-align:center;}
|
|
.shuz .mt-number-animate .mt-number-animate-dot{ width: 15px;/*设置分割符宽度*/ line-height: 50px; float: none; text-align: center;}
|
|
.shuz .mt-number-animate .mt-number-animate-dom{ width:10%;/*设置单个数字宽度*/text-align: center; float: left; position: relative; top: 0;}
|
|
.shuz .mt-number-animate .mt-number-animate-dom .mt-number-animate-span{font-size:25px;}
|
|
.shuz .mt-number-animate .mt-number-animate-dom .mt-number-animate-span{background:#fdfdfd;}
|
|
|
|
.echart-tb{ margin:10px 20px;}
|
|
|
|
.index-bt{ border-bottom:1px solid #dfdfdf; padding:12px 15px;}
|
|
.index-bt span{ display:block; padding-top:3px;}
|
|
.index-bt p{ font-size:16px; color:#333; padding-left:10px;}
|
|
|
|
.zyfx{ padding:10px;}
|
|
.kuai{ position:relative; margin:5px; padding:10px; border:1px solid #dfdfdf; height:83px;}
|
|
.kuai .yuanbj{ position:absolute; top:14px; left:15px; width:76px; height:76px; border-radius:100%;}
|
|
.kuai .bj-lan{ background:#36AAEF;}
|
|
.kuai .bj-lv{ background:#4DCA78;}
|
|
.kuai .wb{ margin-left:107px; margin-right:5px; margin-top:8px;}
|
|
.kuai .wb .shuzhi{ text-align:right; font-size:30px; color:#444; font-weight:bold; margin-bottom:3px;}
|
|
.kuai .wb .shux{ text-align:right; font-size:16px; color:#333;}
|
|
.kuai:hover{ background:url(../img/kuai-h.jpg) center 0px ;animation: kuai 1s;-moz-animation: kuai 1s;-webkit-animation: kuai 1s;-o-animation: kuai 1s;}
|
|
.kuai .yuanbj .icon{ display:block; margin:0px auto; margin-top:25px;}
|
|
@media screen and (max-width:1000px ) {
|
|
|
|
.kuai{ height: auto;}
|
|
.kuai .wb{ margin-left: 0;margin-right: 0;
|
|
|
|
}
|
|
.kuai .yuanbj{ position: relative; left: auto; margin: 0 auto; top: 0 }
|
|
.kuai .wb .shuzhi{ text-align: center;}
|
|
.kuai .wb .shux{ text-align: center;}
|
|
.kuai .yuanbj .icon{ margin-top: 0; position: absolute; top: 50%;left: 50%; transform: translate(-50%,-50%) }
|
|
}
|
|
}
|
|
|
|
|
|
|
|
/*------数据中心-------*/
|
|
.zyfx-nry{ padding:5px; margin-bottom:5px;}
|
|
.zyfx-nry .kuai{ background:#fff; border:1px solid #ECECF0;}
|
|
.zyfx-nry .kuai:hover{ background:#fff url(../img/kuai-h.jpg) center 0px no-repeat;animation: kuai 1s;-moz-animation: kuai 1s; -webkit-animation: kuai 1s;-o-animation: kuai 1s;}
|
|
|
|
.index-bt .xiaob{ display:block; float:left; border-radius:3px; background:#54A0ED; margin-right:5px; padding:2px;}
|
|
.xiaob .icon-xiao{ display:block; margin:0px auto;}
|
|
.xiaob span{ padding-top:0px;}
|
|
|
|
|
|
|
|
|
|
/*------数据分析-------*/
|
|
.sjfx-nry{ padding:5px; margin-bottom:5px;}
|
|
.xkuai{ margin:5px; padding:10px; height:83px; background:#fff;}
|
|
.sjfx-nry .lan-xian{ border-top:5px solid #36AAEF;}
|
|
.sjfx-nry .lv-xian{ border-top:5px solid #4DCA78;}
|
|
.icon-cai{ display:inline-block;}
|
|
.shux-bt{ text-align:center;}
|
|
.shux-bt strong{ font-size:18px; font-weight:normal; color:#444;}
|
|
.shux-bt .icon-sjcczl{ position:relative; top:10px; }
|
|
.shux-bt .icon-jrpt{ position:relative; top:14px; }
|
|
.shux-bt .icon-sjlr{ position:relative; top:13px; }
|
|
.shux-bt .icon-sjlc{ position:relative; top:13px; }
|
|
.xkuai .shuzhi{ font-size:32px; text-align:center; display:block; color:#444; font-weight:bold; margin-top:10px;}
|
|
|
|
.shuzhi .mt-number-animate{ font-family: '微软雅黑'; line-height:30px; height:30px;/*设置数字显示高度*/; font-size: 30px;/*设置数字大小*/ overflow: hidden; text-align:center;}
|
|
.shuzhi .mt-number-animate .mt-number-animate-dot{ width: 15px;/*设置分割符宽度*/ line-height: 30px; float: none; text-align: center;}
|
|
.shuzhi .mt-number-animate .mt-number-animate-dom{ width:22px;/*设置单个数字宽度*/ text-align: center; display:inline-block;}
|
|
.shuzhi .mt-number-animate .mt-number-animate-dom .mt-number-animate-span{font-size: 30px;}
|
|
|
|
.icon-sjttl{background-position:0px -3568px;}
|
|
.icon-sjccl{background-position:0px -3642px;}
|
|
|
|
.zbt-bt{ font-size:25px; color:#135ED7; text-align:center; padding:20px; padding-bottom:8px; }
|
|
.zbt-bt .bold{ font-size:25px; font-weight:bold;}
|
|
.zbt-bt .sm-text{ font-size:20px; }
|
|
.zxbt-bt{ font-size:16px; color:#777; text-align:center; margin-bottom:20px;}
|
|
|
|
|
|
|
|
|
|
/*旅游资源分布表*/
|
|
.sanlie{ margin:15px 10px;}
|
|
.sanlie .lie{ float:left; width:32%; margin:0px 0.5%; border:1px solid #dfdfdf; overflow:hidden;}
|
|
.sanlie .lie p{ padding:5px 0px;}
|
|
.sanlie .lie .mingcheng{ float:left; width:65%; border-right:2px solid #dfdfdf; padding:8px 0px; font-size:16px;}
|
|
.mingcheng .caibiao{ display:block; float:left; margin-left:15px; margin-right:5px;}
|
|
.shuliang{ font-size:22px; text-align:center;}
|
|
|
|
|
|
/*动画*/
|
|
@keyframes kuai
|
|
{
|
|
0%{background:#fff url(../img/kuai-h.jpg) center -140px no-repeat;}
|
|
100%{background:#fff url(../img/kuai-h.jpg) center 0px no-repeat;}
|
|
}
|
|
|
|
@-moz-keyframes kuai
|
|
{
|
|
0%{background:#fff url(../img/kuai-h.jpg) center -140px no-repeat;}
|
|
100%{background:#fff url(../img/kuai-h.jpg) center 0px no-repeat;}
|
|
}
|
|
|
|
@-webkit-keyframes kuai
|
|
{
|
|
0%{background:#fff url(../img/kuai-h.jpg) center -140px no-repeat;}
|
|
100%{background:#fff url(../img/kuai-h.jpg) center 0px no-repeat;}
|
|
}
|
|
|
|
@-o-keyframes kuai
|
|
{
|
|
0%{background:url(../img/kuai-h.jpg) center -140px no-repeat;}
|
|
100%{background:url(../img/kuai-h.jpg) center 0px no-repeat;}
|
|
}
|
|
|
|
|