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
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
| @charset "utf-8";
| /*!
| * @名称：base.css
| * @功能：1、重设浏览器默认样式
| * 2、设置通用原子类
| */
| /* 防止用户自定义背景颜色对网页的影响，添加让用户可以自定义字体 */
| html {
| background:white;
| color:black;
| }
| /* 内外边距通常让各个浏览器样式的表现位置不同 */
| body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,hr,button,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
| margin:0;
| padding:0;
| }
| /* 要注意表单元素并不继承父级 font 的问题 */
| body,button,input,select,textarea {
| font:12px '\5b8b\4f53',arial,sans-serif;
| }
| input,select,textarea {
| font-size:100%;
| }
| /* 去掉 table cell 的边距并让其边重合 */
| table {
| border-collapse:collapse;
| border-spacing:0;
| }
| /* ie bug：th 不继承 text-align */
| th {
| /* text-align:inherit; */
| text-align: center;
| }
| /* 去除默认边框 */
| fieldset,img {
| border:none;
| }
| /* ie6 7 8(q) bug 显示为行内表现 */
| iframe {
| display:block;
| }
| /* 去掉列表前的标识，li 会继承 */
| ol,ul {
| list-style:none;
| }
| /* 对齐是排版最重要的因素，别让什么都居中 */
| caption,th {
| text-align:left;
| }
| /* 来自yahoo，让标题都自定义，适应多个系统应用 */
| h1,h2,h3,h4,h5,h6 {
| font-size:100%;
| font-weight:500;
| }
| /* 统一上标和下标 */
| sub,sup {
| font-size:75%;
| line-height:0;
| position:relative;
| vertical-align:baseline;
| }
| sup {
| top:-0.5em;
| }
| sub {
| bottom:-0.25em;
| }
| /* 让链接在 hover 状态下显示下划线 */
| a:hover {
| text-decoration:none;
| }
| /* 默认不显示下划线，保持页面简洁 */
| ins,a {
| text-decoration:none;
| }
| /* 去除 ie6 & ie7 焦点点状线 */
| a:focus,*:focus {
| outline:none;
| }
| /* 清除浮动 */
| .clearfix:before,.clearfix:after {
| content:"";
| display:table;
| }
| .clearfix:after {
| clear:both;
| overflow:hidden;
| }
| .clearfix {
| zoom:1; /* for ie6 & ie7 */
| }
| .clear {
| clear:both;
| display:block;
| font-size:0;
| height:0;
| line-height:0;
| overflow:hidden;
| }
| /* 设置显示和隐藏，通常用来与 js 配合 */
| .hide {
| display:none;
| }
| .block {
| display:block;
| }
| /* 设置浮动，减少浮动带来的 bug */
| .fl,.fr {
| display:inline;
| }
| .fl {
| float:left;
| }
| .fr {
| float:right;
| }
| /* 文字排版、颜色 */
| .f12{font-size:12px}
| .f13{font-size:13px}
| .f14{font-size:14px}
| .f16{font-size:16px}
| .f20{font-size:20px}
| .fb{font-weight:bold}
| .fn{font-weight:normal}
| .t2{text-indent:2em}
| .red,a.red{color:#cc0031}
| .darkblue,a.darkblue{color:#039}
| .gray,a.gray{color:#878787}
| .lh150{line-height:150%}
| .lh180{line-height:180%}
| .lh200{line-height:200%}
| .unl{text-decoration:underline;}
| .no_unl{text-decoration:none;}
| /* 定位 */
| .tl{text-align:left}
| .tc{text-align:center}
| .tr{text-align:right}
| .cb{clear:both}
| .cl{clear:left}
| .cr{clear:right}
| .vm{vertical-align:middle}
| .pr{position:relative}
| .pa{position:absolute}
| .abs-right{position:absolute;right:0}
| .zoom{zoom:1}
| .hidden{visibility:hidden}
| .none{display:none}
| /* 长度高度 */
| .w10{width:10px}
| .w20{width:20px}
| .w50{width:50px}
| .w90{width:90px}
| .w100{width:100px}
| .w200{width:200px}
| .w250{width:250px}
| .w300{width:300px}
| .w350{width:350px}
| .w400{width:400px}
| .w500{width:500px}
| .w800{width:800px}
| .w{width:100%}
| .h50{height:50px}
| .h80{height:80px}
| .h100{height:100px}
| .h200{height:200px}
| .h{height:100%}
| /* 边距 */
| .m5{margin:5px}
| .m10{margin:10px}
| .m15{margin:15px}
| .m30{margin:30px}
| .mt5{margin-top:5px}
| .mt10{margin-top:10px}
| .mt15{margin-top:15px}
| .mt50{margin-top:50px}
| .mt100{margin-top:100px}
| .mb5{margin-bottom:5px}
| .mb10{margin-bottom:10px}
| .mb15{margin-bottom:15px}
| .mb100{margin-bottom:100px}
| .ml5{margin-left:5px}
| .ml10{margin-left:10px}
| .ml15{margin-left:15px}
| .ml20{margin-left:20px}
| .ml30{margin-left:30px}
| .ml50{margin-left:50px}
| .ml100{margin-left:100px}
| .mr5{margin-right:5px}
| .mr10{margin-right:10px}
| .mr15{margin-right:15px}
| .mr50{margin-right:50px}
| .mr100{margin-right:100px}
| .p10{padding:10px;}
| .p15{padding:15px;}
| .p30{padding:30px;}
| .pt5{padding-top:5px}
| .pt10{padding-top:10px}
| .pt15{padding-top:15px}
| .pt20{padding-top:20px}
| .pt30{padding-top:30px}
| .pt50{padding-top:50px}
| .pb5{padding-bottom:5px}
| .pb100{padding-bottom:100px}
| .pl5{padding-left:5px}
| .pl10{padding-left:10px}
| .pl50{padding-left:50px}
| .pl100{padding-left:100px}
| .pr5{padding-right:5px}
| .pr10{padding-right:10px}
| .pr15{padding-right:15px}
| .pr100{padding-right:100px}
|
|
