CSS..研究...............

傲天♂浪子追风

1. * { word-break: break-all; } /*在IE中实行强制换行*/
   
2. #newsblock { margin-top: 4px; }
   
3. /*-----------------------------------------------------------------------------------综合设置*/
   ' R& d/ Q5 K! u
4. 
   
5. body { margin: 0; background: #FFF; color: #333; text-align: center; font: 12px Arial, Helvetica, sans-serif; }
   
6. #wrap { background: #FFF; margin: 0 auto; text-align: left; width: 910px; padding: 0 4px; w\idth: 910px; }
   
7. 
   2 e9 s4 C$ d  y# y$ |9 V
8. /*链接样式*/
   ( X, ~  m# t& Q+ V6 }
9. a { color: #000; text-decoration: none; }
   
10.         a:hover { text-decoration: underline; color: #000098; }
    
11.                 a:visited { color: #666;}
    
12.         #topmenu a, #menu a, .imglist a, #hotspace li a { text-decoration: none; }
    
13.                 #topmenu a:hover, #menu a:hover, .imglist a:hover, #hotspace li a:hover { text-decoration: underline; }
    + f2 ]- b: E: j# s1 H2 b/ T* T
14.         a img { border: none; }
    
15. li cite { font-style: normal; font-size: 12px; float: right; width: 4em; color: #999; }
    
16.         li cite a { color: #999; }
    
17.                 li cite a:visited { color: #999; }
    0 G( R) Y* e  d
18. .more { float: right !important; color: #000098 !important; background: transparent !important; font-size: 12px !important; font-weight: normal !important; cursor: pointer; }
    
19. 
    
20. /*-----------------------------------------------------------------------------------表单通用样式*/
    
21. 
    ' D" g3 C& C2 m% E+ X
22. form { margin: 0; }
    ( \- y3 {9 |( f' T5 t/ q
23.         input, textarea, button, select { font: 1em Arial, Helvetica, sans-serif; }
    
24.         button { height: 1.8em; padding: 0 0.3em; background: #9FC8DF; cursor: pointer; border: 1px solid;
    
25.                 border-top-color: #C9E3F0; border-right-color: #2A8ABA; border-bottom-color: #2A8ABA; border-left-color: #C9E3F0; }
    
26.         fieldset { border: 0; padding: 0; }
    
27.                 legend { display: none; }
    
28.         label { cursor: pointer; margin-right: 0.5em; }
    * e1 k2 h! C) t7 e* q& E
29. 
    
30. /*-----------------------------------------------------------------------------------头部风格 Header*/
    7 L) b. @' Z( l! ~% n) P
31. /*顶部导航*/
    7 k1 e2 A' R' r5 A& r
32. #topmenu { background: #9FC8DF url(../images/new/title_bg.gif) repeat-x 0 -3px; border-bottom: 4px solid #F5FBFF; border-top: none; text-align: right; line-height: 2em; }
    6 Z2 P& j1 o# v8 U/ z( u' I
33.         #topmenu ul { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid #86B9D6; }
    
34.                 #topmenu li { display: inline; border-left: 1px solid #86B9D6; padding-left: 1em; padding-right: 0.5em; }
    0 H/ w& d& j# n9 I
35.                         #topmenu a { color: #154BA0; }
    
36. 
    8 K3 m( e1 q7 `. W- H$ g* P
37. #pagetitle { padding: 8px 0; height: 76px; he\ight: 60px; border-bottom: 4px solid #F5FBFF; }
    % u* H0 F( D3 A, K/ q* O
38.         #logo { border-right: 1px solid #86B9D6; padding: 0 10px; margin-right: 10px; }
    
39.         .banner468 { float: right; }
    & i2 n; N) M# E$ F# y2 R
40. 
    2 _7 t% R6 j! r
41. /*主导航*/
    
42. #menu { border-top: 2px solid #86B9D6; border-bottom: 1px solid #86B9D6; line-height: 25px; background: url(../images/new/menu_bg.gif); width: 910px; overflow: hidden; }
    / }4 ~( v  O1 m; d5 }, m) Y: ^9 X
43.         #menu ul { list-style: none; margin: 0 1em; padding: 0; width: 100%; overflow: hidden; }
    
44.                 #menu li { float: left; margin: 0 2px; width: 6em; overflow: hidden; white-space: nowrap; }
    
45.         /*首页导航*/
    
46.         #menu dl { margin: 0 1.5em; padding: 0; height: 25px; overflow: hidden; }
    : Y0 a9 f+ F( j  d
47.                 #menu dt { float: left; width: 4em; white-space: nowrap; }
    
48.                         #menu dt a { color: #000098 !important; }
    / X& z, `  V6 \  a" p, ~4 a! v. H
49.                 #menu dd { float: left; width: 6em; margin: 0 2px; overflow: hidden; white-space: nowrap; }
    
50. 
    3 N3 V5 W$ N' o3 W
51. /*您的位置导航*/
    
52. #navigation { padding: 1.2em 0; }
    
53.         #navigation p { margin: 0;}
    
54.                 #navigation p a, #navigation p strong { margin: 0 0.5em; }
    
55.         #searchform { float: right; }
    ' W% B. C) Y$ X& r3 J' j
56.                 #searchform * { vertical-align: top; }
    
57.                 #searchform button { margin-left: 0.5em; }
    * ~9 G4 K8 Q3 l8 n, E
58. 
    
59.         #navigation.simplepage { padding: 0; border-top: 2px solid #009DEA; border-bottom: 1px solid #009DEA; line-height: 25px; background: #EFF5FF; margin-bottom: 1em; }
    3 `/ l' M' f1 J; a$ c
60.                 #navigation.simplepage p { float: right; margin-right: 0.5em; }
    5 ]6 i' r$ o  V! |  y1 q
61.                 .simplepage h2 { margin: 0; font-size: 1.2em; padding-left: 0.5em; }
    % D' s7 x8 [+ U- T- X) V
62. 
    
63. /*-----------------------------------------------------------------------------------布局*/
    ; G! f9 R! Z6 S# v. n
64. 
    / O7 z" p1 K6 Y& j+ _
65. .content { /*三列布局*/
    
66.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y 0 0; }
      E2 _0 M% x- i) e
67.         /*\*/ * html .content { height: 1%; } /**/ *>.content { overflow: hidden; }
    
68. .contentL { /*两列布局，侧边在左侧*/
    * Q' s; A" A  W
69.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y -590px 0; }
    ; X) u: @* T+ I$ R' m- `6 K
70.         /*\*/ * html .contentR { height: 1%; } /**/ *>.contentR { overflow: hidden; }
    
71. .contentR { /*两列布局，侧边在右侧*/
    
72.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y 580px 0; }
    
73.         /*\*/ * html .contentR { height: 1%; } /**/ *>.contentR { overflow: hidden; }
    - T! x5 F, q$ ~" K
74. /*侧边样式*/
    
75. .sideL { width: 296px; float: left; overflow: hidden; }
    
76. .sideR { width: 202px; float: right; overflow: hidden; }
    0 x) u% @$ b0 M/ U
77. /*中间部分样式*/
    9 r* G+ d% y$ v1 q
78. .mainarea { margin: 0 4px; width: 382px; float: left; }
    
79.         .contentL .mainarea { margin: 0 0 0 4px; width: 556px; }
    
80.         .contentR .mainarea { margin: 0 4px 0 0; width: 576px; }
    
81. 
    2 z) A( a/ C  H9 r0 w2 t, }
82. /*-----------------------------------------------------------------------------------版块样式*/
    * k( L3 ^* y$ v" E/ t( q
83. 
    
84. /*版块标题*/
    
85. .blocktitle { clear: both; border: 1px solid #86B9D6; padding: 1px; margin-bottom: 4px; line-height: 30px; }
    
86.         .blocktitle h2 { font-size: 1.2em; margin: 0; padding: 0 5px; background: #9FC8DF url(../images/new/title_bg.gif) repeat-x; }
    
87.         .blocktitle .more { margin-right: 5px; }
    " _- p: V' W" {' A' v
88. 
    ' q) V+ y" t- v/ t
89. /*头条信息*/
    
90. #headline { padding: 5px; height: 70px; he\ight: 58px; overflow: hidden; }
    
91.         #headline strong { font-size: 1.2em; }
    
92.         #headline p { margin: 0.3em 0; }
    
93.         #headline img { float: right; width: 48px; height: 48px; border: 4px solid #FFF; }
    , Y. z2 D! B, I. _' ?) K3 |
94. 
    ; J- h8 m% Z6 i7 z+ d0 q
95. /*侧边版块*/
    + l8 \: M* Y" h" ]
96. .sideblock { margin: 0 0 3px; border: 1px solid #86B9D6; background: #FFF; padding: 3px; }
    
97.         .boldblock { padding: 1px; background: #9FC8DF; } /*突出版块*/
    ( {6 a1 b3 o$ w3 F* U
98.         .cleanblock { border: 1px solid #86B9D6; margin: 0 0 4px; padding: 0; background: #F5FBFF; } /*简单版块*/
    0 P" b; t: z- Q
99.                 .sideblock h3 { margin: 0; font-size: 1em; line-height: 2em; padding-left: 0.5em; border-bottom: 1px solid #BBE9FF; }
    
100.                         /*\*/ * html .sideblock h3 { height: 1%; } /**/
     
101.                 .sideblock p { margin: 0.3em; line-height: 1.6em; }
     1 F: E- T0 s2 _
102.                         .headimg { float: right; margin: 5px 0 2px 5px; width: 80px; height: 80px; border: 4px solid #E2F0F9; }
     6 f2 m9 D! _2 H4 t3 m
103. 
     
104.         /*侧边多行列表*/
     8 b. F& O# e# o- u1 r4 e
105.         .sideblock dl { margin: 0; padding: 5px; background: #FFF; line-height: 1.8em; }
     
106.                 /*\*/ * html .sideblock dl { position: relative; } /**/
     
107.                 .sideblock dt { padding-left: 0.8em; background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.7em; }
     1 y' M+ Y; s1 h! b, Y
108.                 .sideblock dd { color: #999; margin-left: 0.8em; }
     4 i( V+ [; W7 p  f3 a. Y! H; B' I
109.                         .sideblock dd a { color: #999; }
     
110. 
     
111. /*单行信息列表*/
     6 k% B: @- ~% b2 {/ d9 j
112. .msgtitlelist { margin: 0; padding: 5px 0; list-style: none; line-height: 1.6em; }
     8 M! y3 [/ e7 a) Z; J- _. `
113.         .msgtitlelist li { height: 1.6em; overflow: hidden; padding-left: 0.8em; background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.7em; }
     
114.         .mainarea .msgtitlelist { font-size: 1.2em; }
     9 A7 i& _4 {" F* o
115.         .sideblock .msgtitlelist { background: #FFF; }
     + l: M7 r: D0 `  F
116. 
     6 u, q1 H. Z! u7 e
117. /*多行信息列表*/
     
118. .messagelist { margin: 5px 0; padding: 0; list-style: none; line-height: 1.6em; }
     8 x" S1 B) N7 M9 T" H  Y3 _7 j: b6 p8 w
119.         .messagelist li { margin: 5px 0 10px 0;}
     # i) Z  u: N/ T+ L4 b$ K* [) |
120.                 .messagelist li h4 { margin: 5px 0; font-size: 1em; line-height: 2em; background: #F0F9FF; }
     
121.                         .messagelist li h4 a { color: #009; font-size: 1.2em; }
     9 m, q9 w% Q- w! N# T6 G% Q3 i' Q
122.                                 .messagelist li h4 a:visited { font-weight: normal; }
     
123.                 .messagelist li p { margin: 0; }
     " y; A1 u2 `+ c, ~3 h+ ]8 z; w) U
124. 
     
125.         .messagelist dl { margin: 0; padding: 0; line-height: 1.6em; }
     
126.                 .messagelist dt { background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.7em; padding-left: 0.8em; }
     
127.                 .messagelist dd { font-size: 12px; margin: 0; padding-left: 1em; color: #999; }
     9 ]" c2 V/ u% a/ `2 _
128.                         .messagelist dd a { color: #999; }
     
129. 
     9 R7 l/ |9 s7 b0 d1 k% c
130. /*热门话题*/
     
131. #hottag { overflow: hidden;  }
     0 K3 A4 Y. M. m' g6 k9 |3 F4 V
132.         #hottag div { background: #FFF; padding: 0.5em; overflow: hidden; line-height: 1.8em; }
     * f" ?# P2 W: p
133.                 #hottag div { color: #999; overflow: hidden; }
     
134.                 #hottag a { margin-right: 0.2em; white-space: nowrap; }
     % g! v3 p1 o9 r  X* D5 E0 T
135.                         #hottag a em { color: #999; font-style: normal; }
     
136. 
     8 p7 u! c' j2 i) C# F
137. /*用户面板*/
     
138. #userpanel { height: 8.8em; overflow: hidden; }
     
139.         #userpanel form { margin: 5px auto !important; margin: 0 auto; width: 150px; }
     ( \9 H2 h/ X- u" Y; k% E0 h" a; x- H. s
140.                 #userpanel input { width: 90px; }
     
141.                 #userpanel p { margin: 0.5em 0; }
     
142.                 #dologin { float: right; }
     
143.                 #userpanel form a { line-height: 2em; color: #B353B3; border-right: 1px solid #86B9D6; padding-right: 5px; }
     
144.         /*登录后*/
     
145.         #userpanel li { border-bottom: 1px solid #BBE9FF; background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.8em; padding-left: 12px; }
     
146.                 #userpanel li a { color: #000098; }
     
147. 
     . `' E9 x; S" w% t, ~+ h. C6 k
148. /*空间之星*/
     % k& t* S/ a# o
149. #spacestar ul { width: 168px; margin: 0 4px; padding: 0; height: 235px; }
     
150.         #spacestar li { float: left; display: inline; width: 54px; height: 70px; overflow: hidden; margin: 3px 1px; background: #E2F0F9; text-align: center; }
     ! |2 O* J5 q/ Q6 W* J# C; g, a: v
151.         #spacestar img { width: 48px; height: 48px; margin-top: 3px; }
     
152.         #spacestar p { margin: -4px 0 !important; margin: 0 0; line-height: 20px; height: 20px; }
     
153. 
     
154. /*同城空间*/
     
155. #cityspace { background: #F0F9FF; }
     
156. #cityspace form { width: 10.5em; margin: 0 auto; padding: 5px 0; }
     & d  f- w8 C% U
157.         #cityspace select { margin: 2px 0; }
     - r' ?. p* u! L( x7 j6 `# X
158.         #cityspace button { float: right; margin-top: 4px; width: 3.5em; height: 3.5em; }
     1 M6 F8 b) p) C
159.         #blogblock #cityspace { margin: 0 0 4px 0; }
     
160. 
     
161. /*空间排行*/
     " ~% e  R! L/ E" t' }, ]
162. #hotspace ol { margin: 0; padding: 0 0 0 20px; line-height: 20px; background: url(../images/new/hotspace_bg.gif) no-repeat; list-style: none; }
     & q8 Z" T, `! r  }; v0 ^" b# y) `
163.         #hotspace li { height: 20px; overflow: hidden; }
     
164.         #hotspace em { float: right; font-style: normal; font-size: 9px; color: #999; width: 40px; }
     
165. 
     9 V5 G; }+ i* e6 @
166. /*热门文章 */
     
167. #hotarticle { border: 1px solid #86B9D6; background: #E2F0F9; padding: 3px; position: relative; }
     
168.         #hotarticle h3 { font-size: 1.2em; margin: 0; line-height: 22px; border-bottom: 1px solid #86B9D6; }
     
169.         #hotarticletabs { position: absolute; margin: 0; line-height: 18px; top: 7px!important; top: 8px; right: 10px; }
     # r7 y. V0 F, }6 b' b
170.                 #hotarticletabs span { background: #86B9D6; float: right; color: #FFF; margin-right: 2px; height: 18px; padding: 0 5px; cursor: pointer; }
     
171.                         #hotarticletabs span.active { background: #FFF; color: #333; border: 1px solid #86B9D6; border-bottom: none; }
     
172.         #hotarticle ul { background: #FFF; margin: 0; padding: 0.5em; list-style: none; line-height: 1.7em; height: 16.5em; overflow: hidden; }
     
173.                 #hotarticle li { height: 1.7em; overflow: hidden; color: #999; padding-left: 0.8em; background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.7em; }
     
174. 
       k$ d5 f8 a( n8 Q6 q) }+ ]& ]
175. /*图片列表*/
     - p# O( O% v0 s* B0 r9 s
176. .imgthumblist { margin: 0 3px; padding: 0; list-style: none; }
     ) a& G# C8 a3 Y" w" `2 {& ]
177.         /*\*/ * html .imgthumblist { height: 1%; }/**/ *>.imgthumblist { overflow: hidden; }
     0 @/ U" E: B; `- G# S
178.                 .imgthumblist li { float: left; display: inline; background: #F0F9FF; width: 108px; height: 163px; width: 100px; he\ight: 155px; overflow: hidden; border: 1px solid #B9D0ED; padding: 3px; margin: 3px; }
     ; @: T$ P  ^4 q
179.                         .imgthumblist li.list1line { height: 123px; height: 115px; }
     ! L$ f: |% o0 H0 j' l% G. e
180.                         .imgthumblist li.list2line { height: 143px; height: 135px; }
     
181.                         .contentL .imgthumblist li { margin: 0 1px 3px; }
     
182.                         .imgthumblist img { width: 100px; height: 100px; }
     - ^% @6 C4 B1 v5 c4 \1 Q
183.                         .imgthumblist p { margin: 0; text-align: center; line-height: 1.3em; }
     9 Q) f* k9 k* A% n
184.         .throughgallery { width: 100%; clear: both; margin-bottom: 5px; padding-bottom: 3px; background: #E2F0F9; }
     ' q  i6 K. N7 v( ?% C+ ~' ^
185.                 .throughgallery .imgthumblist { margin: 0; }
     1 i1 j2 ~( o7 [) H$ Q, W
186.                 .throughgallery .imgthumblist li { height: 120px; margin: 3px 1px; }
     
187. 
     
188. /*商品*/
     
189. /*\*/ * html .goodsthumblist { height: 1%; } /**/ *>.goodsthumblist { overflow: hidden; }
     
190.         .goodsthumblist { margin: 0; padding: 3px 0; list-style: none; }
     * Y  t4 K& H0 u- A
191.                 .goodsthumblist li { float: left; width: 90px; height: 100px; text-align: center; }
     
192.                         .goodsthumblist li img { width: 70px; height: 70px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED; }
     ; P, m$ w' r4 ]/ y" Z* D
193.                         .goodsthumblist li p { margin: -3px 0 0 !important; margin: 0; height: 1.5em; line-height 1.5em; overflow: hidden; }
     
194. 
     
195. .imgtitlelist { margin: 10px 0; padding: 0; list-style: none; }
     
196.                 .imgtitlelist li { padding-left: 85px; padding-bottom: 5px; margin: 5px 0; border-bottom: 1px solid #E2F0F9; }
     1 T1 V; {- V5 J. ^( e* Q
197.                 /*\*/ * html .imgtitlelist li { height: 1%; } /**/ .imgtitlelist>li { overflow: hidden; }
     * ^& G8 ]5 n4 }+ J
198.                         .imgtitlelist li h4 { margin: 0.3em 0; font-size: 1em; }
     
199.                         .imgtitlelist li img { float: left; margin-left: -85px; width: 70px; height: 70px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED; }
     
200.                         .imgtitlelist li p { margin: 0; line-height: 1.5em; }
     
201.         .sideblock .imgtitlelist li { padding-left: 65px; }
     
202.                 .sideblock .imgtitlelist li img { width: 48px; height: 48px; margin-left: -60px; }
     1 H7 {; y6 B5 S9 o
203.        
     4 E: @7 M4 A; y/ J# W9 s
204. 
     
205. /*栏目区块列表*/
     $ Y+ {* i  z- L# H! B
206. .category {  margin: 4px 0 10px 0; }
     # ~/ u" c- ]- v) s8 z6 j
207.         .category h3 { margin: 0 0 5px; font-size: 1.2em; line-height: 1.8em; height: 1.8em; border-bottom: 1px solid #86B9D6; }
     
208.                 .category h3 strong { background: #E9ECEF; float: left; padding: 0 8px; }
     + `, E5 ^, T: K
209.                         .category h3 strong a { color: #333; text-decoration: none; }
     . ?/ h  s$ k7 s3 h7 i
210.         /*.category ul { background: #FFF; margin: 0; padding: 4px 0 0 0; list-style: none; line-height: 1.6em; }
     , M$ u. m: o( v' _. A/ }
211.                 .category li { padding-left: 0.8em; background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.7em; }
     
212.         .catecommend { background: #F0F9FF; margin: 0; line-height: 2em; height: 2em; overflow: hidden; padding: 0 1em; }*/
     
213.                 .catecommend a { color: #000099; white-space: nowrap; margin-right: 0.5em; }
     ( s# M1 M7 f$ B$ Q- ]
214. 
     / \2 b1 \7 o6 T; J) @( B& s3 l2 M) ^* F& @
215. 
     . A7 }$ ], a1 E  X" s( Z
216. /*-----------------------------------------------------------------------------------首页各版块*/
     
217. 
     
218. /*#commendimage { height: 155px; }
     
219. #topicnews { height: 217px; }
     - Y/ i* P2 Y) x1 G5 ?" j, f7 |
220. #newgoods, #commendgoods { height: 200px; }
     
221. #hotcommentfile, #hotfile, #newlink, #hotlink { height: 220px; }*/
     : T! C' k9 r8 D3 b9 \
222. 
     
223. 
     
224. 
     
225. 
     % e7 Q4 S. ]  N8 C6 Q/ `
226. /*信息列表*/
     3 W6 W! Z5 A, P# _
227. .articlelist li { padding-left: 60px; }
     # ^/ T: V0 u0 q! Q) t* z8 H$ B
228.         .articlelist h4 img { float: left; margin-left: -60px; width: 48px; height: 48px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED; }
     ) V5 C9 W/ s' N2 j* ]2 F
229. /*.articlelist  h3 a { font-size: 12px; font-weight: normal; margin-left: 1em; color: #B353B3; }
     + B& d; z) Q: t: \/ C( I" }
230.        
     - ^- V  Q: W8 _9 u; X" o
231.         .articlelist ul { margin: 0; padding: 0; background: #FFF; padding-left: 5px; list-style: none; }
     & {# v, [1 D/ X* n! ~
232.                 .articlelist li { position: relative; padding-left: 60px; margin-top: 1em; }
     
233.         .articlelist h4 { margin: 0; background: #F0F9FF; font-size: 1.2em; padding: 0.2em 0.5em; cursor: pointer; }
     
234.                 .articlelist h4 em { font-style: normal; font-weight: normal; font-size: 0.8em; color: #B353B3; margin-left: 0.3em; }
     
235.                 .articlelist h4 a { color: #000099; }
     
236.                 .articlelist li img { position: absolute; left: 0!important; left: -67px; top: 0; border: 3px solid #9FC8DF; width: 48px; height: 48px; }
     
237.                
     - s& Y7 \+ Q; e  @" n4 ~% {+ G. [+ x: `+ P
238.                 .articlelist li strong { font-weight: normal; color: #999; line-height: 2em; padding-left: 0.5em; }
     - O* l" B2 l4 e
239.                         .articlelist li strong a { color: #999; }
     
240.                 .articlelist li p { margin: 0.3em 0; line-height: 1.6em; }
     
241.                         .articlelist li p a.more { float: none !important; }*/
     . H7 Q- s; c* J5 P- K( _7 V' n
242. 
     
243. 
     : c  \7 u4 B. x& E7 Q+ |8 X% P1 k
244. .catepic { text-align: center; }
     
245.         .catepic img { margin-top: 10px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED;
     $ y  ]( o! T0 t# h4 `1 o5 ?
246.                 max-width: 150px; max-height: 150px; width: expression(this.width > 150 ? 150: true); height: expression(this.height > 150 ? 150: true); }
     
247.         .catepic p { text-align: left; margin: 0.5em; }
     
248. 
     7 D/ ~. D# ~3 ]' u
249. /*专题列表*/
     1 A- ~) g6 R2 w- u
250. #subjectlist { border-color: #86B9D6; padding: 2px; }
     
251.         #subjectlist h3 { border: none; background: #9FC8DF; }
     
252.         #subjectlist li { border-bottom: 1px solid #E2F0F9; text-align: center; padding: 3px; }
     
253.                 #subjectlist p { margin: 0; line-height: 1.2em; }
     
254. 
     8 m+ u! y% Z6 g. H- w
255. 
     5 J' Y$ y! I2 h% R
256.         #xspace-rates { height: 2em; }
     " q' o8 n/ {4 }6 z
257.                 #xspace-rates label { float: left; line-height: 24px; margin-right: 5px; }
     
258.                 #xspace-rates a { float: left; border: 1px solid #EEE; text-decoration: none; width: 20px; height: 20px; text-align: center; line-height: 20px; margin: 0 2px; }
     
259.                         #xspace-rates a:hover { border-color: #CCC; }
     
260.                         .xspace-rates-5 #xspace-rate-5, .xspace-rates-3 #xspace-rate-3, .xspace-rates-1 #xspace-rate-1, .xspace-rates0 #xspace-rate0, .xspace-rates1 #xspace-rate1, .xspace-rates3 #xspace-rate3, .xspace-rates5 #xspace-rate5 { background: #DDD; border-color: #BBB; font-weight: bold; }
     8 O: u% r9 w# K( }
261. 
     
262. 
     
263. #panel { width: 600px; overflow: hidden; margin: 1em auto; }
     
264. 
     , I4 _9 f1 m  s
265. 
     ( e+ M3 L% e: Z! R/ ?& N& B
266. /*Pages*/
     3 c& i$ [/ `6 Y
267. .pages { text-align: right; border-top: 1px solid #9FC8DF; }
     
268.         /*.pages table { margin: 3px 0 3px auto; text-align: center; }
     
269.                 .pages td { padding: 0 5px; border: 1px solid #B9D0ED; background: #FFF; }
     
270.                 .pages a { text-decoration: none; }
     * V7 I2 D- z3 d1 h& F( C. _
271.                 .pages .currentpage { background: #F0F9FF; border-color: #86B9D6; font-weight: bold; }*/
     7 o( R4 G4 u( h
272. 
     ! a6 L, i* I- l0 u" v5 s; o
273. /* 分页 */
     
274. .xspace-page { margin: 2px 2px 2px auto; }
     & f- O, y4 ?2 v, o6 S. R
275.         table.xspace-page a { display: block; background: #E2F0F9; padding: 0.3em 0.5em; text-decoration: none; }
     
276.                 table.xspace-page a:hover { background: #86B9D6; }
     
277.         table.xspace-page td.xspace-current { background: #86B9D6; padding: 0.3em 0.5em; font-weight: bold; }
     
278.         table.xspace-page td.xspace-totlerecord, .xspace-page td.xspace-totlepages { background: #E2F0F9; padding: 0.3em 0.5em; }
     
279. 
     
280. .smalltxt { font-size: 12px; color: #999; font-weight: normal; }
     
281.         .smalltxt a, .smalltxt a:visited { color: #999 !important; }
     
282. 
     
283. /*-----------------------------------------------------------------------------------页脚 Footer*/
     0 }# p. ]) v% e- _4 C0 O; X& u
284. #footer { clear: both; border-top: 2px solid #86B9D6; padding-top: 1em; padding-bottom: 2em; text-align: center; font: 100% Verdana, Arial, Helvetica, sans-serif; }
     . z5 ]8 R* \, g! W9 `
285.         #footer p { margin: 0.3em 0; color: #999; }
     
286.         #footer strong { color: #007AB6; }
     4 e) |0 N$ @7 X7 L2 F# L
287.         #footer em { font-style: normal; font-weight: bold; color: #96A800; }
     
288.        
     
289. .imglogolist { margin: 0; padding: 0; list-style: none; text-align: center; }
       A" Y0 r+ e1 z: s( e3 P$ b$ @
290.        
     " J% Z& j* e& g, `, a# E
291. #articledetail { border: 1px solid #86B9D6; text-align: center; }
     3 l; j. {8 M! ]& t4 t+ Z% z
292. .articletitle { font-size: 1.6em; margin: 1em 0 0.5em; }
     
293. .articleinfo { border-bottom: 1px solid #9FC8DF; margin: 0;}
     
294. .articlectrl { margin: 0.5em 0 1.5em; }
     
295. 
     
296.         #articlebody { width: 98%; margin: 0 auto; overflow: hidden; text-align: left; overflow-y: hidden; line-height: 1.8em; font-size: 1.2em; }
     
297.         #articlebody * { line-height: normal; }
     
298.                 #articlebody  p, #articlebody  div { line-height: 1.8em !important; margin: 10px 0; }
     ! k8 ~/ p7 |# L3 G
299.                         #articlebody  p *, #articlebody  div * { line-height: normal !important; }
     ) h6 N" ?2 f4 q1 a* K. Q
300.        
     # d7 N+ r+ S& L
301.         #articlebody .addoninfo { border: 1px solid #EEE; }
     
302.                 #articlebody .addoninfo h5 { font-size: 1em; margin: 0; line-height: 2em !important; border-bottom: 1px solid #EEE; padding-left: 1em; }
     
303.                 #articlebody .addoninfo ul { margin: 0.5em 0 0.5em 2em; padding: 0; }
     
304.                         #articlebody .addoninfo li { line-height: 1.6em !important; }
     
305.        
       X6 ?. S  `9 f! o' k
306.         #articlebody img { width: expression(this.width > 500 ? 500: true); max-width: 500px;  }
     
307.        
     - K0 T1 D2 [2 D6 A
308.         #articlebody kbd.showvideo, #articlebody kbd.showflash { font: 1em Arial, Helvetica, sans-serif; cursor: pointer; text-decoration: underline; }
     
309.         #commentlist { overflow: hidden; border: 1px solid #86B9D6; margin: 4px 0 0; padding: 0 5px; }
     
310.                 #commentlist h3 { font-size: 1em; line-height: 2em; margin: 0; background: #F0F9FF; border-bottom: 1px solid #86B9D6; }
     
311.                                 #commentlist img { max-width: 500px; width: expression(this.width > 500 ? 500: true); }
     
312.                         #commentlist .messagelist li div { width: 98%; margin: 0 auto; overflow: hidden; text-align: left; overflow-y: hidden; line-height: 1.8em; }
     / j+ p3 Y9 p7 A. l- x7 x, D" R
313.                                 #commentlist .messagelist li div * { line-height: normal; }
     
314.                                         #commentlist .messagelist li div  p, #commentlist .messagelist li div  div { line-height: 1.8em !important; margin: 10px 0; }
     
315.                                                 #commentlist .messagelist li div  p *, #commentlist .messagelist li div  div * { line-height: normal !important; }
     
316. 
     + O5 F: ?3 f5 d3 N7 b" x8 t4 f$ K
317. /*发表评论*/
     8 B$ K! D; Y2 K' z, {! n0 F
318. #comment { margin-top: 4px; }
     
319.         #comment h3 { margin: 0 5px; font-size: 1em; line-height: 2em; }
     
320.         #comment form { background: #FFF; margin: 0; padding: 5px; }
     
321.         #comment p { margin: 0.3em 0; }
     
322.         .seccodeline * { vertical-align: middle; }
     3 x- Q: T1 g/ y/ Z, ]! N7 H
323.         #xspace-rates { height: 2em; }
     0 w* F% _7 f$ u+ m
324.                 #xspace-rates label { float: left; line-height: 24px; margin-right: 5px; }
     . d) M6 q+ {7 t% M
325.                 #xspace-rates a { float: left; border: 1px solid #EEE; text-decoration: none; width: 20px; height: 20px; text-align: center; line-height: 20px; margin: 0 2px; }
     
326.                         #xspace-rates a:hover { border-color: #CCC; }
     4 ?2 b' }3 P+ O5 ^
327.                         .xspace-rates-5 #xspace-rate-5, .xspace-rates-3 #xspace-rate-3, .xspace-rates-1 #xspace-rate-1, .xspace-rates0 #xspace-rate0, .xspace-rates1 #xspace-rate1, .xspace-rates3 #xspace-rate3, .xspace-rates5 #xspace-rate5 { background: #DDD; border-color: #BBB; font-weight: bold; }
     . c" x: b% J# k( k
328. 
     
329. /*AJAX div*/
     
330. .xspace-ajaxdiv { position:absolute; padding: 5px; border: 1px solid #BBB; background: #FCFFEF; text-align: left; }
     
331.         .xspace-ajaxdiv h5 { line-height: 24px; font-size: 1em; margin: 0; }
     ) M( v" ?$ C: f1 P3 S) p
332.                 .xspace-ajaxdiv h5 a { float: right; font-weight: normal; }
     3 D' P% T" ?8 x9 J
333.         .xspace-ajaxcontent { background: #FFF; border: 1px solid #EEE; }
     
334.                 .xspace-ajaxcontent form { margin: 0; }

复制代码

傲天♂浪子追风

1. /*-----------------------------------------------------------------------------------综合设置*/
   2 U# c& ^4 B+ D
2. 
   ) |0 |, x1 D3 [' p
3. body { margin: 0; background: #FFF; color: #333; text-align: center; font: 12px Arial, Helvetica, sans-serif; }
   
4. #wrap { background: #FFF; margin: 0 auto; text-align: left; width: 910px; padding: 0 4px; w\idth: 910px; }
   ' l- }. }- h( u0 y& \
5. 
   ! a5 d; ], p! J

复制代码

3 m9 q# k6 s6 g" g" Y
分析
. H) z+ R& i& ?' |! t- f3 g7 u

1. margin属性说明：
   5 p( C* K+ a3 H
2. 
   + v0 k" D( o' k- s: v' `* k
3. 检索或设置对象四边的外延边距。
   
4. 如果提供全部四个参数值，将按上－右－下－左的顺序作用于四边。
   & v2 r% k6 K; \$ k0 |
5. 如果只提供一个，将用于全部的四边。
     k1 P) z9 w' x' g) u
6. 如果提供两个，第一个用于上－下，第二个用于左－右。
   " `0 w& d. _1 S1 m; I: t3 p; _
7. 如果提供三个，第一个用于上，第二个用于左－右，第三个用于下。
   
8. 内联对象要使用该属性，必须先设定对象的height或width属性，或者设定position属性为absolute。
   
9. 在IE4+，margin属性不可用于td和tr对象。
   
10. 外延边距始终透明。
    ) j) H+ z; B* P( B# _
11. 
    
12. color : 　指定颜色
    % B7 ~: [6 p' M  Y: T1 b
13. text-align:文本的对齐方式。(left : 　左对齐,right : 　右对齐,center : 　居中,justify : 　两端对齐)
    ) A8 E% G5 n! v% U# G
14. font: 12px Arial, Helvetica, sans-serif;  :这段是字体相关的
    6 ~* h5 M3 y+ r6 I" `) i, t* P% ~* Z
15. 
    
16. 
    

复制代码

傲天♂浪子追风

1. /*链接样式*/
   3 r( {8 @3 i* b2 H
2. a { color: #000; text-decoration: none; }
   & R% u& H' }1 H( d4 q
3.         a:hover { text-decoration: underline; color: #000098; }
   
4.                 a:visited { color: #666;}
   & [8 R5 k2 i9 T) K2 Y1 s
5.         #topmenu a, #menu a, .imglist a, #hotspace li a { text-decoration: none; }
   
6.                 #topmenu a:hover, #menu a:hover, .imglist a:hover, #hotspace li a:hover { text-decoration: underline; }
   . `! d& L6 i. h8 Z
7.         a img { border: none; }
   
8. li cite { font-style: normal; font-size: 12px; float: right; width: 4em; color: #999; }
   
9.         li cite a { color: #999; }
   
10.                 li cite a:visited { color: #999; }
    ; H' _3 N7 d) [2 j0 k  q
11. .more { float: right !important; color: #000098 !important; background: transparent !important; font-size: 12px !important; font-weight: normal !important; cursor: pointer; }
    ) M+ s2 k) Q( E2 O! ~
12. 
    

复制代码

$ H7 J  q" t; D, m4 `分析

! g% F; D  B4 I/ B- y  Z& y

1. 
   
2. text-decoration:文本连接的属性,一般有以下几种参数:
   
3. none : 　无装饰
   0 a4 N2 G7 E" \6 N/ X+ d' `
4. blink : 　闪烁
   . m" H! q* x+ G1 w
5. underline : 　下划线
   / m4 M8 R# ~) [# y5 I
6. line-through : 　贯穿线
   2 q& H4 ?4 z0 w( P7 F
7. overline : 　上划线
   9 S. f7 v% L5 u
8. 
   ; E6 ?4 `% M) f5 r0 K; C
9. 
   / k/ [1 q$ f$ R6 Z. f" D7 C
10. hover:设置对象在其鼠标悬停时的样式表属性。
    1 ^# F/ i. b/ u' f- C7 O, D! M
11. 
    * H0 ?8 T7 A# U# J0 W1 e* P- {$ n
12. visited:对象在其链接地址已被访问过时的样式表属性。
    4 \4 E. f8 x. d2 y. @  T
13. 
    
14. #topmenu a, #menu a, .imglist a, #hotspace li a { text-decoration: none; }
    + A3 \4 C. h. e+ A
15. #topmenu a:hover, #menu a:hover, .imglist a:hover, #hotspace li a:hover { text-decoration: underline; }:
    " c- @# B& H* n* G  c, S6 G
16. 上面这两行是与鼠标相关
    * n; P, Z, L, j& j; h' T5 ~
17. 
    
18. a img { border: none; }图片连接相关
    
19. 
    
20. 
    
21. cite:这个一般是引用标签的时候用的,不知道用来这里做什么
    8 T' x8 ~' a4 F0 [! j
22. 
    
23. 
    
24. font-style:字体式样,一般常用参数有:
    5 q  A; Z2 o0 D. R& b
25. normal : 正常的字体
    : |( n1 X5 l# {$ r( y
26. italic : 斜体。对于没有斜体变量的特殊字体，将应用oblique
    
27. oblique : 倾斜的字体
    , }1 _+ V6 k0 q( y8 q. P1 C6 N
28. 
    : e. k5 ]/ X8 O( [
29. 
    4 |$ ]& c2 P7 C4 b: k& ]+ e2 \
30. float: right 该属性的值指出了对象是否浮动及如何浮动。常用参数如下:
    " S" l- u* a8 \: z! }5 y1 l
31. none : 　对象不浮动
    & b& k) T3 U% h: l/ n; c+ O
32. left : 　对象浮在左边
    
33. right : 　对象浮在右边
    
34. 
    
35. 
      F$ C6 b' f; A
36. important:样式表条目,提升指定样式规则的应用优先权。
    
37. 
    + G9 M  ~6 p; Y0 y% Q2 V6 p; ]5 W
38. 
    5 r. K+ F0 d3 ~" ?4 a
39. background: transparent 这个的意思就是背景透明...
    
40. 
    
41. 
    
42. 
    
43. font-weight: normal :文本字体的粗细,常用参数如下:
    
44. normal : 正常的字体。相当于number为400。声明此值将取消之前任何设置
    ' T4 [: c/ o& E# g0 S) ~
45. bold : 粗体。相当于number为700。也相当于b对象的作用
    
46. bolder : IE5+　特粗体
    
47. lighter : IE5+　细体
    : Z" S6 J2 g+ |0 P. Z8 @# d0 X
48. number : IE5+　100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
    ) k' C: \: S% S1 r; `9 I
49. 
    
50. cursor: pointer:这个是鼠标放在对象中的状态,简单点来可以这样说,也就是鼠标放在连接上的时候显示的鼠标形状,一般有以下N种参数,这个真的是TMD的多啊
    & [2 @  Y7 ^; m8 \! {
51. 语法：(每一竖隔开为一个状态)
    
52. cursor : auto | crosshair | default | hand | move | help | wait | text | w-resize |s-resize | n-resize |e-resize | ne-resize |sw-resize | se-resize | nw-resize |pointer | url (url)
    / `  X% }. [& b& Q7 g
53. 
    
54. 
    2 l6 b+ ~: A3 ~- ]) M! D
55. 
    ; y, {( j9 a% z. \& U1 ]
56. 
    . e" e9 z* O: ?
57. 
    + z( P, l# S) U8 m' g
58. 
    
59. 
    $ W# X6 e) f, C& Q

复制代码

傲天♂浪子追风

1. /*-----------------------------------------------------------------------------------表单通用样式*/
   
2. 
   
3. form { margin: 0; }
   ( P0 D5 B' D* q8 z7 g( j1 {- W
4.         input, textarea, button, select { font: 1em Arial, Helvetica, sans-serif; }
   / {4 k4 C, J2 T0 `' K; D, |" P
5.         button { height: 1.8em; padding: 0 0.3em; background: #9FC8DF; cursor: pointer; border: 1px solid;
   , q- E! y. R4 S" a. P4 O
6.                 border-top-color: #C9E3F0; border-right-color: #2A8ABA; border-bottom-color: #2A8ABA; border-left-color: #C9E3F0; }
   
7.         fieldset { border: 0; padding: 0; }
   & a' h+ k* R- T
8.                 legend { display: none; }
   
9.         label { cursor: pointer; margin-right: 0.5em; }
   / e) S  y0 v  Q" y9 o2 X: O

复制代码

bronwen

还没完吧？怎么没有了啊.....

傲天♂浪子追风

是还没完的，忙于游戏，就没继续写了

傲天♂疯紫

有点晕！！偶只懂硬件！！