main.css
10.1 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
body,html,h1,h2,h3,h4,h5,h6,p,ul,ol,li,dl,dt,dd,th,td,form,object,iframe,blockquote,pre,a,abbr,address,code,img,fieldset,form,label
{margin:0;padding:0;}
body,html,input,button,textarea{color:#717171;font:12px/1.8 "Microsoft YaHei","微软雅黑",Arial,Tahoma,Verdana,Helvetica, sans-serif;}
article,aside,figcaption,figure,footer,header,hgroup,main,nav,section,time{display:block}
body{background-color:#F8F6F9;}
h1{font-size:18px;}
h2{font-size:16px;}
h3,h4,h5{font-size:14px;}
img{border:none;vertical-align:middle;}
li{list-style:none;}
i,em{font-style:normal;}
a{color:#717171;text-decoration:none;}
a:focus{outline:none;}
a:hover{text-decoration:underline;}
.disable{display:none;}
.f10{
font-size: 10px;
}
/* 左侧目录 */
#list a{
color:#FFF;
}
/* 清除浮动 */
.clearfix:after,.layout:after,.onsale:after,.doc-tabs ul:after,.doc-list ul:after,.experts ul:after,.rank-items:after{content:"";height:0;display:block;clear:both;visibility:hidden;}
* html .clearfix,* html .layout,* html .onsale,* html .doc-tabs ul,* html .doc-list ul,* html .experts ul,* html .rank-items{display:inline-block;}
* +html .clearfix,* +html .layout,* +html .onsale,* +html .doc-tabs ul,* +html .doc-list ul,* +html .experts ul,* +html .rank-items{display:inline-block;}
/* 布局 */
.topbar .inner,.topbn ul,.onsale,.titbar{width:980px;margin:0 auto;}
.layout{width:950px;padding:10px 10px 0 20px;margin:0 auto 25px;background:#fff;position:relative;}
/* 交互 */
.topbn li a,.doc-img i,.btn-prev b,.btn-next b,.experts li .img i{-moz-transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out;-ms-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}
.doc-img i,.experts li .img i{background:#000;visibility:hidden;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter:alpha(opacity=0);opacity:0;}
.doc-img:hover i,.experts li .img:hover i,.img-hover i,.experts li .img-hover i{-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";filter:alpha(opacity=20);opacity:0.2;visibility:visible;}
/* 小图 */
.onsale-doc .btn-prev b,.onsale-doc .btn-next b,.onsale-doc li a.doc-img,.doc-tabs li,.loadmore,.rank-item dd{background-image:url(../images/sprite.gif);background-repeat:no-repeat;background-color:transparent;}
/* ===================
页头
*/
/* 大图 */
.topbn{height:353px;background:#F8F6F9 url(../images/title.png) center 0 no-repeat;margin:0 auto 0;min-width:980px;}
.topbn ul{padding:15px 0 0;}
.topbn li{float:left;padding:0 30px 0 0;}
.topbn li a:hover{opacity:0.8;}
.topbn .z{width:980px;color:#F7652E;margin:0 auto;}
.topbn .z a{color:#F7652E;}
/* ===================
主体
*/
/* 公司说明 */
.onsale{background:#fff;margin:0 auto 20px;}
.onsale .side-img{display:inline;float:left;}
.onsale-doc{width:655px;float:right;padding:25px 20px 0 0;position:relative;}
.onsale-doc span.btn-prev,.onsale-doc span.btn-next {display:block;width:22px;height:265px;background:#fff;position:absolute;top:25px;z-index:222;}
.onsale-doc span.btn-prev{left:0;}
.onsale-doc span.btn-next{right:20px;}
.onsale-doc span.btn-prev b,.onsale-doc span.btn-next b{display:block;width:22px;height:46px;margin:110px 0 0;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=17)";filter:alpha(opacity=17);opacity:0.17;cursor:pointer;}
.onsale-doc span.btn-prev-hover b,.onsale-doc span.btn-next-hover b{-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";filter:alpha(opacity=70);opacity:0.7;}
.onsale-doc span.btn-prev b{background-position:0 -45px;}
.onsale-doc span.btn-next b{background-position:-22px -45px;}
.onsale-doc div.scroll-box,.onsale-doc div.scroll-box ul,.onsale-doc div.scroll-box li{height:280px;}
.onsale-doc div.scroll-box{width:620px;height:275px;margin:0 auto;position:relative;overflow:hidden;padding:3px 0 0;}
.onsale-doc div.scroll-box ul{width:200%;}
.onsale-doc li{width:556px;float:left;font-size:14px;}
.onsale-doc li div.li-box{width:556px;margin:0 auto;}
.onsale-doc li a.doc-img,.onsale-doc li a.doc-img i,.onsale-doc li a.doc-img img{display:block;width:109px;height:146px;cursor:pointer;}
.onsale-doc li a.doc-img{padding:5px;position:relative;background-position:-371px -42px;margin:0 auto 5px;}
.onsale-doc li a.doc-img i{z-index:222;position:absolute;left:5px;top:5px;}
.onsale-doc li p.doc-tit{height:36px;line-height:18px;overflow:hidden;margin:0 3px;}
.onsale-doc li span.doc-price{display:block;height:24px;line-height:24px;overflow:hidden;margin:0 0 5px;color:#FF0000;text-align: center;}
.onsale-doc li a.btn-buy {display:block;height:30px;line-height:30px;border-bottom:4px solid #ef4e43;background:#fe5d52;color:#fff;text-align:center;margin:0 3px;font-size:16px;}
.onsale-doc li a.btn-buy:hover{text-decoration:none;background:#ef4e43;border-bottom-color:#d23c31;}
.onsale-doc b.ico-buy-now,.onsale-doc b.ico-onsale {display:block;width:42px;height:34px;position:absolute;left:3px;top:-1px;z-index:333;}
/* 文档标题 */
.titbar {height:30px;line-height:30px;background:#457192;}
.titbar h2 {display:inline;float:left;padding:0 110px 0 18px;font-size:18px;background-position:right 0; background:url(../images/mulu.jpg) no-repeat;}
.titbar h2,.titbar h2 a{color:#fff;}
.titbar a.more {color:#FFF;}
.titbar a.more{display:inline;float:right;font-size:14px;margin:0 20px 0 0;}
.doc-tabs {height:35px;margin-bottom:-5px;width:100%;position:relative;overflow:hidden;z-index:333;}
.doc-tabs ul{margin:0 0 0 -21px;}
.doc-tabs li{line-height:23px;padding:0 21px;background-position:-498px -42px;float:left;font-size:18px;position:relative;z-index:22;}
.doc-tabs li,.doc-tabs li a{color:#535353;}
.doc-tabs li span{float:left;padding:0 0 3px;cursor:pointer;}
.doc-tabs li.current span{color:#0f88e8;}
.doc-tabs .curline{width:72px;height:28px;position:absolute;border-bottom:3px solid #0f88e8;padding:0;background:none;z-index:2;left:-21px;top:0;margin:0 0 0 21px;}
/* 文档列表 */
.doc-list {padding:0 15px 15px 0;min-height:240px;}
/*底部demo样式库格式控制*/
.top-list {padding:15px 0 0 5px;min-height:170px;}
.doc-list ul{height:245px;overflow:hidden;position:relative;}
.top-list ul{height:165px;overflow:hidden;position:relative;}
.doc-list li{width:460px;height:235px;float:left;padding:10px 0 0;font-size:14px;}
.top-list li{width:20%;height:170px;float:left;padding:10px 0 0;font-size:14px;}
/*中间目录样式控制*/
.doc-list li .inner {width:440px;position:relative;margin-left:17px;}
/*底部demo样式库格式控制*/
.top-list li .inner {width:190px;position:relative;}
.doc-list li .doc-img,.doc-list li .doc-img img,.doc-list li .doc-img i{display:block;width:109px;height:146px;cursor:pointer;}
.top-list li .doc-img,.top-list li .doc-img img,.top-list li .doc-img i {display:block;width:130px;height:83px;cursor:pointer;}
.doc-list li .doc-img,.top-list li .doc-img{margin:0 auto 5px;padding:2px;position:relative;border:1px solid #dbdbdb;border-bottom-width:2px;border-radius:1px 1px 2px 2px;}
.doc-list li .doc-img i,.top-list li .doc-img i{position:absolute;left:2px;top:2px;}
.doc-list li .doc-tit,.top-list li .doc-tit{height:36px;line-height:18px;overflow:hidden;margin:0 3px; text-align:center;}
.doc-list li .doc-title,.top-list li .doc-title{width:50px;text-align: left;display: inline-block;}
.doc-list li .doc-price,.tpo-list li .doc-price{width:70px;height:20px;line-height:20px;color:#fe5d52;display: inline-block;}
.doc-list li .btn-buy ,.top-list li .btn-buy {line-height:20px;padding:0 4px;background:#fe5d52;color:#fff;position:absolute;right:0px;top:205px;}
.doc-list li .btn-buy:hover,.top-list li .btn-buy:hover{background:#fb3224;text-decoration:none;}
/* 加载控制 */
.experts ul{height:120px;overflow:hidden;margin:0 0 15px;position:relative;}
.experts li{width:300px;height:120px;float:left;}
.experts li .img,.experts li .img i,.experts li .img img{display:block;width:92px;height:92px;cursor:pointer;}
.experts li .img{padding:3px;border:1px solid #dbdbdb;float:left;position:relative;}
.experts li .img i{position:absolute;left:3px;top:3px;}
.experts li .info{padding:10px 0 0 120px;font-size:14px;}
.experts li .info h4{font-weight:normal;}
.experts li .info h4 a{display:inline-block;margin:0 12px 0 0;color:#535353;}
.experts li .info h4 a{*display:inline;}
.loadmore {display:block;width:105px;height:26px;padding:0 0 2px;line-height:26px;text-align:center;font-size:14px;background-position:-55px -44px;position:absolute;left:50%;margin-left:-52px;bottom:-5px;cursor:pointer;}
.loadmore:hover{color:#333;text-decoration:none;}
.show-all ul{height:auto;margin-bottom:0;}
.show-all .loadmore{display:none;}
/* 右侧导航 */
.side-nav{width:150px;position:fixed;left:50%;margin-left:500px;bottom:95px;_position:absolute;_bottom:auto;_top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||95)));display:none;}
.side-nav .nav-hd{display:block;height:30px;background:url(../images/title_r.png) right 0 no-repeat;}
.side-nav .nav-list {background:#8B9AB1;}
.side-nav .nav-list li{border-bottom:1px solid #F0F0F0;}
.side-nav .nav-list li.current {background:#5D7D94;}<!-- 更改右侧目录切换颜色-->
.side-nav .nav-list li.current a{border-bottom-color:#9a8ebc;}
.side-nav .nav-list li,.side-nav .nav-list li a{color:#fff;font-size:13px;}
.side-nav .nav-list li a{display:block;height:30px;line-height:30px;border-bottom:1px solid #c2bcd9;padding:0 0 0 20px;}
.side-nav .nav-list li a:hover{text-decoration:none;}
.side-nav .nav-list li li,.side-nav .nav-list li li a{height:31px;line-height:31px;border:0;font-size:12px;}
.side-nav .nav-list li li{border:0;border-top:1px dotted #F0F0F0;margin-top:-1px;position:relative;}
.side-nav .nav-list li li a{-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";filter:alpha(opacity=70);opacity:0.7;}
.side-nav .nav-list li li a:hover,.side-nav .nav-list li li.current a{-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";filter:alpha(opacity=100);opacity:1;}
.side-nav .nav-list li ul{width:100%;position:relative;overflow:hidden;background:#8B9AB1;}
.nav-fixed{display:block;}
/*内容格式*/
#content_1{
font-size:10px;
line-height:25px;
height:100%;
}
#content_1 div{
float:left;
}