| | |
| | | position: relative; |
| | | height: 10%; |
| | | width: 100%; |
| | | z-index: 999; |
| | | } |
| | | .title{ |
| | | position: absolute; |
| | |
| | | height: 30%; |
| | | } |
| | | .introduce-content { |
| | | text-indent: 2em; |
| | | margin-top: 13px; |
| | | height: 150px; |
| | | width: 100%; |
| | |
| | | } |
| | | .footer span { |
| | | position: absolute; |
| | | left: 20%; |
| | | left: 18%; |
| | | top: 50%; |
| | | transform:translateY(-50%); |
| | | -webkit-transform:translateY(-50%); /*兼容-webkit-引擎浏览器*/ |
| | | -moz-transform:translateY(-50%); /*兼容-moz-引擎浏览器*/ |
| | | overflow: hidden; |
| | | text-overflow: ellipsis; |
| | | white-space:nowrap; |
| | | } |
| | | .footer img { |
| | | position: absolute; |
| | |
| | | float: left; |
| | | width: 52%; |
| | | height: 100%; |
| | | padding: 2% 1%; |
| | | padding: 1.2% 1% 1.5% 1%; |
| | | box-sizing: border-box; |
| | | } |
| | | .map-board{ |
| | |
| | | width: 100%; |
| | | border: 1px solid rgba(20, 80, 136, 1); |
| | | position: relative; |
| | | background-color: rgba(3, 36, 85, 0.5); /*针对其他浏览器*/ |
| | | background-color: rgba(3, 36, 85, 0.4); /*针对其他浏览器*/ |
| | | filter: Alpha(Opacity=50); /* 针对IE*/ |
| | | } |
| | | |
| | |
| | | right: 0; |
| | | bottom: 0; |
| | | } |
| | | .usage-rate .usage-rate-right span { |
| | | letter-spacing: 2px; |
| | | font-size: large; |
| | | } |
| | | .usage-rate-english { |
| | | position: relative; |
| | | height: 50%; |
| | |
| | | float: right; |
| | | color: #e77b2c; |
| | | vertical-align: middle; |
| | | font-size: 18px; |
| | | } |
| | | |
| | | /*边框*/ |
| | |
| | | top: 0; |
| | | opacity: 1; |
| | | } |
| | | } |
| | | |
| | | .item-img { |
| | | background-size: 100% 100%; |
| | | } |
| | | #img-1 { |
| | | background-image: url(../img/banner/banner1.jpg); |
| | | } |
| | | #img-2 { |
| | | background-image: url(../img/banner/banner2.jpg); |
| | | } |
| | | #img-3 { |
| | | background-image: url(../img/banner/banner3.jpg); |
| | | } |
| | | #img-4 { |
| | | background-image: url(../img/banner/banner4.jpg); |
| | | } |
| | | #img-5 { |
| | | background-image: url(../img/banner/banner5.jpg); |
| | | } |