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

傲天♂浪子追风

1. * { word-break: break-all; } /*在IE中实行强制换行*/
   
2. #newsblock { margin-top: 4px; }
   " M/ K! r. A8 E3 A- S4 n
3. /*-----------------------------------------------------------------------------------综合设置*/
   
4. 
   0 i3 R. p- `4 W% N) R
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; }
   2 ~/ }7 p* [/ z
7. 
   
8. /*链接样式*/
   
9. a { color: #000; text-decoration: none; }
   % F+ c6 s0 i. A- k! {# ^
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; }
    
14.         a img { border: none; }
    $ Q' [. D) e3 S/ X4 y0 i
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; }
    
18. .more { float: right !important; color: #000098 !important; background: transparent !important; font-size: 12px !important; font-weight: normal !important; cursor: pointer; }
    " C# p+ A: e6 [, s9 I- C% ~! R
19. 
    + O; a0 K7 Q( U$ K
20. /*-----------------------------------------------------------------------------------表单通用样式*/
    ) ]) K: r$ ~  F+ @' \, b
21. 
    
22. form { margin: 0; }
    
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; }
    + l5 R+ h8 [3 S/ [- _: v
26.         fieldset { border: 0; padding: 0; }
    
27.                 legend { display: none; }
    
28.         label { cursor: pointer; margin-right: 0.5em; }
    
29. 
    
30. /*-----------------------------------------------------------------------------------头部风格 Header*/
    % \# X1 u. r8 o
31. /*顶部导航*/
    5 _1 t+ y# s. T6 o5 M9 S! g' M7 T
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; }
    
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; }
    3 Z5 c4 Y! ?( e
35.                         #topmenu a { color: #154BA0; }
    - [( H# V0 s: P8 d- N& S
36. 
    
37. #pagetitle { padding: 8px 0; height: 76px; he\ight: 60px; border-bottom: 4px solid #F5FBFF; }
    4 x0 e: c1 h) ~' r$ L/ C
38.         #logo { border-right: 1px solid #86B9D6; padding: 0 10px; margin-right: 10px; }
    - K; o: x9 c6 R/ }, h6 P% j, U# o( k
39.         .banner468 { float: right; }
    2 x5 D8 k) J* J+ e8 R4 _2 q3 u
40. 
    , k" z% ~5 P; f6 i% H- |
41. /*主导航*/
    # I3 g# i' p( R, Q
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; }
    
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; }
    - _/ r$ Z0 D3 B  Y) a$ ^
47.                 #menu dt { float: left; width: 4em; white-space: nowrap; }
    : B, O5 s8 I$ |1 a1 d  u, x5 }- r
48.                         #menu dt a { color: #000098 !important; }
    & D# n9 L3 y. J2 f/ i- h7 V
49.                 #menu dd { float: left; width: 6em; margin: 0 2px; overflow: hidden; white-space: nowrap; }
    
50. 
    * x2 |( ^+ E) Q6 H, B
51. /*您的位置导航*/
    , Q. G5 l& P. ]4 M# A1 a
52. #navigation { padding: 1.2em 0; }
    ; Z, \$ W4 A3 M& K) ~
53.         #navigation p { margin: 0;}
    : S1 ?! B$ R2 D, v7 V
54.                 #navigation p a, #navigation p strong { margin: 0 0.5em; }
    
55.         #searchform { float: right; }
    , z( S4 b0 }3 h  w* |
56.                 #searchform * { vertical-align: top; }
    
57.                 #searchform button { margin-left: 0.5em; }
    
58. 
    / ~' I) `+ Y/ D
59.         #navigation.simplepage { padding: 0; border-top: 2px solid #009DEA; border-bottom: 1px solid #009DEA; line-height: 25px; background: #EFF5FF; margin-bottom: 1em; }
    1 S' F* N3 S$ B% a4 r) j
60.                 #navigation.simplepage p { float: right; margin-right: 0.5em; }
    
61.                 .simplepage h2 { margin: 0; font-size: 1.2em; padding-left: 0.5em; }
    . _1 t& V3 N9 w; w2 ^% z: }1 D* Q
62. 
    
63. /*-----------------------------------------------------------------------------------布局*/
    8 D9 P4 S9 a+ Z% b- `' s' b) `
64. 
    
65. .content { /*三列布局*/
    " D# R  s7 W) G' ^2 d3 ?
66.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y 0 0; }
    
67.         /*\*/ * html .content { height: 1%; } /**/ *>.content { overflow: hidden; }
    
68. .contentL { /*两列布局，侧边在左侧*/
    
69.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y -590px 0; }
    
70.         /*\*/ * html .contentR { height: 1%; } /**/ *>.contentR { overflow: hidden; }
    
71. .contentR { /*两列布局，侧边在右侧*/
    
72.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y 580px 0; }
    / K( }5 x% V% ^8 L! S
73.         /*\*/ * html .contentR { height: 1%; } /**/ *>.contentR { overflow: hidden; }
    0 ~' q, k  Y$ }, J' v
74. /*侧边样式*/
    
75. .sideL { width: 296px; float: left; overflow: hidden; }
    
76. .sideR { width: 202px; float: right; overflow: hidden; }
    / q/ m0 f. L: e2 X
77. /*中间部分样式*/
    7 C0 B# A+ C# O. J( H
78. .mainarea { margin: 0 4px; width: 382px; float: left; }
    6 g* ?" P  ^+ D6 c2 x5 ^  p; c
79.         .contentL .mainarea { margin: 0 0 0 4px; width: 556px; }
    
80.         .contentR .mainarea { margin: 0 4px 0 0; width: 576px; }
    
81. 
    $ W- f  Z8 p( p. I
82. /*-----------------------------------------------------------------------------------版块样式*/
    ! I% [: |5 _) i% S7 ~& `# D* e* B
83. 
    $ d8 v% o+ |' e, b6 u* C
84. /*版块标题*/
    
85. .blocktitle { clear: both; border: 1px solid #86B9D6; padding: 1px; margin-bottom: 4px; line-height: 30px; }
    7 {$ P2 o% E6 [' `3 z" J4 z, ?
86.         .blocktitle h2 { font-size: 1.2em; margin: 0; padding: 0 5px; background: #9FC8DF url(../images/new/title_bg.gif) repeat-x; }
    & O5 @7 {( b. W: D$ @+ x) n  X& V
87.         .blocktitle .more { margin-right: 5px; }
    ( M7 X4 n' D% b; I: T9 x
88. 
    
89. /*头条信息*/
    7 D2 F- y* X/ \1 ^: }
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; }
    
94. 
    
95. /*侧边版块*/
    
96. .sideblock { margin: 0 0 3px; border: 1px solid #86B9D6; background: #FFF; padding: 3px; }
    
97.         .boldblock { padding: 1px; background: #9FC8DF; } /*突出版块*/
    % m. Y* {: a7 K6 i( q, R/ _
98.         .cleanblock { border: 1px solid #86B9D6; margin: 0 0 4px; padding: 0; background: #F5FBFF; } /*简单版块*/
    $ {' F( l$ w* O$ G  {9 k
99.                 .sideblock h3 { margin: 0; font-size: 1em; line-height: 2em; padding-left: 0.5em; border-bottom: 1px solid #BBE9FF; }
    & G4 a' _- m) t5 J  L
100.                         /*\*/ * html .sideblock h3 { height: 1%; } /**/
     ( i, Z0 a! U' [9 Y/ u; m
101.                 .sideblock p { margin: 0.3em; line-height: 1.6em; }
     
102.                         .headimg { float: right; margin: 5px 0 2px 5px; width: 80px; height: 80px; border: 4px solid #E2F0F9; }
     ; h' B- t0 F- R+ J
103. 
     & F. f9 x% j* V& \% A3 N7 K
104.         /*侧边多行列表*/
     
105.         .sideblock dl { margin: 0; padding: 5px; background: #FFF; line-height: 1.8em; }
     
106.                 /*\*/ * html .sideblock dl { position: relative; } /**/
     . o6 I& m2 I+ g6 q1 Z$ H4 P6 f
107.                 .sideblock dt { padding-left: 0.8em; background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.7em; }
     7 _7 O6 K( R5 t- r- B
108.                 .sideblock dd { color: #999; margin-left: 0.8em; }
     ' m( {" Z4 U, C  p0 d; e5 x( s4 @
109.                         .sideblock dd a { color: #999; }
     + L4 D: N9 l! Y1 ?8 |5 h+ U- A
110. 
     1 q' u) N, L4 P' Z& F8 t1 v# a/ d/ E
111. /*单行信息列表*/
     
112. .msgtitlelist { margin: 0; padding: 5px 0; list-style: none; line-height: 1.6em; }
     : S- I3 [& h  Y: M
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; }
     / W2 ]6 I9 p6 a' q
114.         .mainarea .msgtitlelist { font-size: 1.2em; }
     
115.         .sideblock .msgtitlelist { background: #FFF; }
     
116. 
     
117. /*多行信息列表*/
     3 i5 z( L3 |  s# D' O$ k4 Q3 I
118. .messagelist { margin: 5px 0; padding: 0; list-style: none; line-height: 1.6em; }
     
119.         .messagelist li { margin: 5px 0 10px 0;}
     
120.                 .messagelist li h4 { margin: 5px 0; font-size: 1em; line-height: 2em; background: #F0F9FF; }
     : u: L) @5 d. }0 i
121.                         .messagelist li h4 a { color: #009; font-size: 1.2em; }
     
122.                                 .messagelist li h4 a:visited { font-weight: normal; }
     
123.                 .messagelist li p { margin: 0; }
     
124. 
     ' ^4 J: Z2 n0 I% D% G: a( M
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; }
     . G# Z1 ^: H& g( h' D$ x
127.                 .messagelist dd { font-size: 12px; margin: 0; padding-left: 1em; color: #999; }
     * B( g. f; F& x& k3 H
128.                         .messagelist dd a { color: #999; }
     / y. o! s1 H3 F1 {) r& @
129. 
     4 `8 e( i9 e( T8 X! h7 j% ]
130. /*热门话题*/
     
131. #hottag { overflow: hidden;  }
     
132.         #hottag div { background: #FFF; padding: 0.5em; overflow: hidden; line-height: 1.8em; }
     
133.                 #hottag div { color: #999; overflow: hidden; }
     
134.                 #hottag a { margin-right: 0.2em; white-space: nowrap; }
     1 B$ v/ b) q% J: O! I8 X
135.                         #hottag a em { color: #999; font-style: normal; }
     1 }3 k1 \& o: L8 q- M% \
136. 
     ; J0 T/ M! G' h  b
137. /*用户面板*/
     
138. #userpanel { height: 8.8em; overflow: hidden; }
     8 J  x" S+ f+ [4 a% }; x4 q
139.         #userpanel form { margin: 5px auto !important; margin: 0 auto; width: 150px; }
     2 q& L& W& H2 K6 B
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; }
     / [2 t& Q6 X+ e1 I( P* @
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; }
     ! V. m3 ~3 H+ @! k
147. 
     
148. /*空间之星*/
     
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; }
     8 _3 Z5 c0 J+ {
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; }
     $ W* ~9 T. v3 N- p0 r
153. 
     : Z0 [! W9 I3 \4 A$ B* f; O
154. /*同城空间*/
     - z# I1 Y; T6 b& E0 y: s5 g
155. #cityspace { background: #F0F9FF; }
     8 P8 z# f5 Y9 P
156. #cityspace form { width: 10.5em; margin: 0 auto; padding: 5px 0; }
     
157.         #cityspace select { margin: 2px 0; }
     # J! D* s* t6 M/ h1 f* t% a
158.         #cityspace button { float: right; margin-top: 4px; width: 3.5em; height: 3.5em; }
     
159.         #blogblock #cityspace { margin: 0 0 4px 0; }
     * u) t8 A/ `/ b1 |) @) s2 w2 a8 F8 {* C
160. 
     " i. H& F9 I. a0 S
161. /*空间排行*/
     
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; }
     
163.         #hotspace li { height: 20px; overflow: hidden; }
     
164.         #hotspace em { float: right; font-style: normal; font-size: 9px; color: #999; width: 40px; }
     / l6 Q9 G5 R1 t- ^
165. 
     
166. /*热门文章 */
     
167. #hotarticle { border: 1px solid #86B9D6; background: #E2F0F9; padding: 3px; position: relative; }
     # u7 O; H, h+ ^
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; }
     + `& }- \6 i  Q% Q& [  E
170.                 #hotarticletabs span { background: #86B9D6; float: right; color: #FFF; margin-right: 2px; height: 18px; padding: 0 5px; cursor: pointer; }
     1 N. U: }" B9 z" ^# N2 J8 d: U. h
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; }
     # R$ ~; a0 \+ t( z
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. 
     - G$ h+ O( T  C' u0 k1 k
175. /*图片列表*/
     , Q2 s5 b, C4 l) q# ]* \+ ^
176. .imgthumblist { margin: 0 3px; padding: 0; list-style: none; }
     
177.         /*\*/ * html .imgthumblist { height: 1%; }/**/ *>.imgthumblist { overflow: hidden; }
     9 c; ]& Y0 ?; z
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; }
     
179.                         .imgthumblist li.list1line { height: 123px; height: 115px; }
     
180.                         .imgthumblist li.list2line { height: 143px; height: 135px; }
     
181.                         .contentL .imgthumblist li { margin: 0 1px 3px; }
     0 ~' e7 X/ N, j
182.                         .imgthumblist img { width: 100px; height: 100px; }
     
183.                         .imgthumblist p { margin: 0; text-align: center; line-height: 1.3em; }
     . k8 x0 s4 C! i+ |8 J& V3 A' h
184.         .throughgallery { width: 100%; clear: both; margin-bottom: 5px; padding-bottom: 3px; background: #E2F0F9; }
     7 ~, B: e/ {2 ~8 F4 Y6 \9 ^
185.                 .throughgallery .imgthumblist { margin: 0; }
     , B5 ^9 w9 Y: U8 b2 d# ]
186.                 .throughgallery .imgthumblist li { height: 120px; margin: 3px 1px; }
     ! P5 W7 c" z6 b; F
187. 
     
188. /*商品*/
     
189. /*\*/ * html .goodsthumblist { height: 1%; } /**/ *>.goodsthumblist { overflow: hidden; }
     / F9 s  p. {% h2 _
190.         .goodsthumblist { margin: 0; padding: 3px 0; list-style: none; }
     " n' D6 m% @2 s# \4 Z) V1 |% C
191.                 .goodsthumblist li { float: left; width: 90px; height: 100px; text-align: center; }
     ; o: M! ^5 U* Z+ ~. W: u
192.                         .goodsthumblist li img { width: 70px; height: 70px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED; }
     ' R7 @! J2 I6 B2 m1 L( R* ^8 \6 R
193.                         .goodsthumblist li p { margin: -3px 0 0 !important; margin: 0; height: 1.5em; line-height 1.5em; overflow: hidden; }
     " N7 b+ `) |1 \% Z" _7 c
194. 
     / c0 g& w) p0 ?
195. .imgtitlelist { margin: 10px 0; padding: 0; list-style: none; }
     * T/ p% c! S4 ]1 ~+ a# U5 X
196.                 .imgtitlelist li { padding-left: 85px; padding-bottom: 5px; margin: 5px 0; border-bottom: 1px solid #E2F0F9; }
     
197.                 /*\*/ * html .imgtitlelist li { height: 1%; } /**/ .imgtitlelist>li { overflow: hidden; }
     1 M& z1 w% e% G/ }# X6 T
198.                         .imgtitlelist li h4 { margin: 0.3em 0; font-size: 1em; }
     . ?* U# d! k4 i5 l
199.                         .imgtitlelist li img { float: left; margin-left: -85px; width: 70px; height: 70px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED; }
     ! {% ^0 p  v& l1 [8 x7 o! B
200.                         .imgtitlelist li p { margin: 0; line-height: 1.5em; }
     
201.         .sideblock .imgtitlelist li { padding-left: 65px; }
     + R2 A  c) i" W, a; v
202.                 .sideblock .imgtitlelist li img { width: 48px; height: 48px; margin-left: -60px; }
     # E$ [- ]6 m9 e) e1 [) {
203.        
     
204. 
     3 @3 _7 @2 |2 p& y7 |# n% K) m. K; J+ L
205. /*栏目区块列表*/
     
206. .category {  margin: 4px 0 10px 0; }
     % m2 q: m. y* ~5 W' n& o  U, ?
207.         .category h3 { margin: 0 0 5px; font-size: 1.2em; line-height: 1.8em; height: 1.8em; border-bottom: 1px solid #86B9D6; }
       B6 o0 U3 j/ _- H7 w5 V3 D" o
208.                 .category h3 strong { background: #E9ECEF; float: left; padding: 0 8px; }
     ) }3 x* K! V& E# E
209.                         .category h3 strong a { color: #333; text-decoration: none; }
     5 J( O; `$ |) K- M
210.         /*.category ul { background: #FFF; margin: 0; padding: 4px 0 0 0; list-style: none; line-height: 1.6em; }
     + f9 o: N, w% O5 Q' ^" v0 d
211.                 .category li { padding-left: 0.8em; background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.7em; }
       w5 p: F9 y4 s+ f* |. D! y$ o0 C! H# Y8 ^
212.         .catecommend { background: #F0F9FF; margin: 0; line-height: 2em; height: 2em; overflow: hidden; padding: 0 1em; }*/
     2 F% {2 y. t9 r) c' I
213.                 .catecommend a { color: #000099; white-space: nowrap; margin-right: 0.5em; }
     3 D! ~: [0 B2 |
214. 
     # A& Y/ X( B* |+ K
215. 
     
216. /*-----------------------------------------------------------------------------------首页各版块*/
     5 n; i6 `: a$ Y, R
217. 
     
218. /*#commendimage { height: 155px; }
     ; ~9 \3 Z4 X; y  g
219. #topicnews { height: 217px; }
     
220. #newgoods, #commendgoods { height: 200px; }
     
221. #hotcommentfile, #hotfile, #newlink, #hotlink { height: 220px; }*/
     1 b: s( j5 K% w8 E$ E
222. 
     
223. 
     8 ?$ z/ v7 j- m* e" `5 X- C
224. 
     
225. 
     
226. /*信息列表*/
     
227. .articlelist li { padding-left: 60px; }
     ! @. B9 l3 B$ A) _6 H6 z4 U
228.         .articlelist h4 img { float: left; margin-left: -60px; width: 48px; height: 48px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED; }
     
229. /*.articlelist  h3 a { font-size: 12px; font-weight: normal; margin-left: 1em; color: #B353B3; }
     ; X3 ]# B! ?) F1 G3 F
230.        
     ) `( i5 {' k! m% g  k5 q
231.         .articlelist ul { margin: 0; padding: 0; background: #FFF; padding-left: 5px; list-style: none; }
     5 l7 a2 y; d, I0 B0 [, K1 w
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; }
     * G# p. I4 `: d. R
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.                
     
238.                 .articlelist li strong { font-weight: normal; color: #999; line-height: 2em; padding-left: 0.5em; }
     0 P) N8 k; x. w  o
239.                         .articlelist li strong a { color: #999; }
     ) c& t( O8 E# W0 O' F
240.                 .articlelist li p { margin: 0.3em 0; line-height: 1.6em; }
     
241.                         .articlelist li p a.more { float: none !important; }*/
     
242. 
     % R3 t( x' O% u* w
243. 
     
244. .catepic { text-align: center; }
     4 `! k( G: K; ?3 P. j. c, Y
245.         .catepic img { margin-top: 10px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED;
     
246.                 max-width: 150px; max-height: 150px; width: expression(this.width > 150 ? 150: true); height: expression(this.height > 150 ? 150: true); }
     : E) k6 |3 j% s4 G
247.         .catepic p { text-align: left; margin: 0.5em; }
     , k" i) B* L9 W0 y
248. 
     
249. /*专题列表*/
     2 T4 Z/ A8 C% J
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; }
     4 K- d7 C4 U- Q  x8 f- R& f
254. 
     
255. 
     3 z& c8 p. _! v& F6 d, B3 y
256.         #xspace-rates { height: 2em; }
     . Q& z% X0 T% m! B+ \, W# c
257.                 #xspace-rates label { float: left; line-height: 24px; margin-right: 5px; }
     $ d" y0 A, S" S% {( |, T6 }
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; }
     3 @, r; }7 v2 h7 G& O$ o
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; }
     0 w2 ~8 o0 q& M6 u
261. 
     & J' x0 a, S' {3 f2 m8 @4 r* t
262. 
     
263. #panel { width: 600px; overflow: hidden; margin: 1em auto; }
     
264. 
     
265. 
     9 i9 A9 l( u. |' v3 a: \
266. /*Pages*/
     % D8 U0 T- i: p, H& |) T
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; }
     
271.                 .pages .currentpage { background: #F0F9FF; border-color: #86B9D6; font-weight: bold; }*/
     
272. 
     
273. /* 分页 */
     . v  ^" k  x1 b% [0 C1 t' v
274. .xspace-page { margin: 2px 2px 2px auto; }
     & O9 x; Q7 I1 t
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; }
     . i+ n, ?! b# g1 [* _. `
279. 
     & t7 w" s. m  H3 w+ ~% }
280. .smalltxt { font-size: 12px; color: #999; font-weight: normal; }
     0 l( Q- |( }1 ~3 j+ ~9 I* ^
281.         .smalltxt a, .smalltxt a:visited { color: #999 !important; }
     
282. 
     
283. /*-----------------------------------------------------------------------------------页脚 Footer*/
     
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; }
     
285.         #footer p { margin: 0.3em 0; color: #999; }
     
286.         #footer strong { color: #007AB6; }
     ) m/ d4 L; R1 B5 k. \' K
287.         #footer em { font-style: normal; font-weight: bold; color: #96A800; }
     
288.        
     + z/ n* T# N  B1 g% P
289. .imglogolist { margin: 0; padding: 0; list-style: none; text-align: center; }
     
290.        
     
291. #articledetail { border: 1px solid #86B9D6; text-align: center; }
     
292. .articletitle { font-size: 1.6em; margin: 1em 0 0.5em; }
     
293. .articleinfo { border-bottom: 1px solid #9FC8DF; margin: 0;}
     - m0 H; S! Q! E+ z8 K1 _
294. .articlectrl { margin: 0.5em 0 1.5em; }
     + m7 x) _8 @) l9 ~; x/ N7 x
295. 
     ! @, g" {% G& t' {8 d
296.         #articlebody { width: 98%; margin: 0 auto; overflow: hidden; text-align: left; overflow-y: hidden; line-height: 1.8em; font-size: 1.2em; }
     4 k6 l& d  D' |$ m% w
297.         #articlebody * { line-height: normal; }
     " D3 w5 n9 q( B4 X0 z
298.                 #articlebody  p, #articlebody  div { line-height: 1.8em !important; margin: 10px 0; }
     
299.                         #articlebody  p *, #articlebody  div * { line-height: normal !important; }
     
300.        
     - a+ Y' J+ q* m* s
301.         #articlebody .addoninfo { border: 1px solid #EEE; }
     9 a) ]% ~& Z2 g3 _, J
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; }
     ( \8 Z0 P& f, B& u0 k  o& z
304.                         #articlebody .addoninfo li { line-height: 1.6em !important; }
     
305.        
     5 @2 k. A6 O  q0 ]
306.         #articlebody img { width: expression(this.width > 500 ? 500: true); max-width: 500px;  }
     9 M5 h- Y0 G- o' G# ?& b' _
307.        
     ; e5 p; t* J! P
308.         #articlebody kbd.showvideo, #articlebody kbd.showflash { font: 1em Arial, Helvetica, sans-serif; cursor: pointer; text-decoration: underline; }
     " i$ J$ i$ s6 f5 S: F3 A9 R
309.         #commentlist { overflow: hidden; border: 1px solid #86B9D6; margin: 4px 0 0; padding: 0 5px; }
     % A% ]4 [+ R! m4 g+ p
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); }
     . V9 n6 A/ n! I
312.                         #commentlist .messagelist li div { width: 98%; margin: 0 auto; overflow: hidden; text-align: left; overflow-y: hidden; line-height: 1.8em; }
       l1 S: H6 }3 y& _
313.                                 #commentlist .messagelist li div * { line-height: normal; }
     1 H  q, w+ G' ~& w+ V; f
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; }
     ( F9 z$ k) N1 G; g  e. _
316. 
     
317. /*发表评论*/
     
318. #comment { margin-top: 4px; }
     
319.         #comment h3 { margin: 0 5px; font-size: 1em; line-height: 2em; }
     , P3 O! w9 m7 B! p* E( {3 A: h
320.         #comment form { background: #FFF; margin: 0; padding: 5px; }
     
321.         #comment p { margin: 0.3em 0; }
     
322.         .seccodeline * { vertical-align: middle; }
     % B6 y+ b% ~# k4 U
323.         #xspace-rates { height: 2em; }
     8 y! l- R' Q& \9 |. y! e# g
324.                 #xspace-rates label { float: left; line-height: 24px; margin-right: 5px; }
     
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; }
     $ L2 M7 L* r6 r0 ^6 R( m% t0 |
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; }
     2 y, `1 i  `4 Z  d9 [
328. 
     
329. /*AJAX div*/
     
330. .xspace-ajaxdiv { position:absolute; padding: 5px; border: 1px solid #BBB; background: #FCFFEF; text-align: left; }
     $ [+ Z. D: U# b% z
331.         .xspace-ajaxdiv h5 { line-height: 24px; font-size: 1em; margin: 0; }
     
332.                 .xspace-ajaxdiv h5 a { float: right; font-weight: normal; }
       ]3 c" N0 d9 Q
333.         .xspace-ajaxcontent { background: #FFF; border: 1px solid #EEE; }
     
334.                 .xspace-ajaxcontent form { margin: 0; }

复制代码

傲天♂浪子追风

1. /*-----------------------------------------------------------------------------------综合设置*/
   * j/ a) M: j: c) W  O# `
2. 
   : B" b$ J& n5 D: b5 Y" 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; }
   , |6 ]6 X9 B0 G$ |- t8 |' Q$ X
5. 
   

复制代码

分析
* {3 C) X/ o+ |0 t9 T4 `

1. margin属性说明：
   
2. 
   7 D* E# \% K9 k5 k  a) g6 O" n$ e
3. 检索或设置对象四边的外延边距。
   9 c! w- n$ m6 s
4. 如果提供全部四个参数值，将按上－右－下－左的顺序作用于四边。
   
5. 如果只提供一个，将用于全部的四边。
   0 v0 T% k, t: F! j4 N3 K6 l5 W
6. 如果提供两个，第一个用于上－下，第二个用于左－右。
   % f* a: F; X* J$ N. E4 v. ~
7. 如果提供三个，第一个用于上，第二个用于左－右，第三个用于下。
   
8. 内联对象要使用该属性，必须先设定对象的height或width属性，或者设定position属性为absolute。
   
9. 在IE4+，margin属性不可用于td和tr对象。
   
10. 外延边距始终透明。
    ' c# e0 U( `3 y) f, L/ k3 g
11. 
    7 f4 y* Q* n& R
12. color : 　指定颜色
    5 ]# F' W0 e  W( |$ L. d
13. text-align:文本的对齐方式。(left : 　左对齐,right : 　右对齐,center : 　居中,justify : 　两端对齐)
    - `" t/ m$ g, d7 _
14. font: 12px Arial, Helvetica, sans-serif;  :这段是字体相关的
    
15. 
    
16. 
    

复制代码

傲天♂浪子追风

1. /*链接样式*/
   
2. a { color: #000; text-decoration: none; }
   7 d$ d  `$ s0 L* ]9 G/ y7 o
3.         a:hover { text-decoration: underline; color: #000098; }
   * V5 Y+ c% G$ h; V8 I- t6 d
4.                 a:visited { color: #666;}
     K  A" E! C6 ^  p  I2 z9 u
5.         #topmenu a, #menu a, .imglist a, #hotspace li a { text-decoration: none; }
   / _  s7 z4 ~) ^* [( r
6.                 #topmenu a:hover, #menu a:hover, .imglist a:hover, #hotspace li a:hover { text-decoration: underline; }
   
7.         a img { border: none; }
   0 x8 A" ^$ `$ Q7 U
8. li cite { font-style: normal; font-size: 12px; float: right; width: 4em; color: #999; }
   $ W" h9 C+ p( b+ P+ Y3 k
9.         li cite a { color: #999; }
   + I. p' S( E. `/ B1 x
10.                 li cite a:visited { color: #999; }
    
11. .more { float: right !important; color: #000098 !important; background: transparent !important; font-size: 12px !important; font-weight: normal !important; cursor: pointer; }
    
12. 
    

复制代码

- X  W+ p) ^9 M
5 L- E1 L& l9 R, w, a分析
) g7 o. C0 `9 U" w0 _

1. 
   & W/ w8 ~. G: |* t  _' B' o: N& ^
2. text-decoration:文本连接的属性,一般有以下几种参数:
   ! J+ t& B% U. D
3. none : 　无装饰
   4 X" |! @8 X7 ~1 o) o: Z
4. blink : 　闪烁
   2 v- \! ?9 o+ |8 P+ V
5. underline : 　下划线
   
6. line-through : 　贯穿线
   3 K; L/ l7 ?. a7 c; W+ ~* J( W
7. overline : 　上划线
   
8. 
   - V& M; l( R1 Q. }" s5 Q2 Z
9. 
   
10. hover:设置对象在其鼠标悬停时的样式表属性。
    ; O7 j/ Q. m: J0 }5 w' r
11. 
    2 s- a4 U9 ^0 p( z
12. visited:对象在其链接地址已被访问过时的样式表属性。
    * |$ M+ L: X- f
13. 
    6 B4 N9 x7 e: Y# W1 J8 {3 T8 C
14. #topmenu a, #menu a, .imglist a, #hotspace li a { text-decoration: none; }
    
15. #topmenu a:hover, #menu a:hover, .imglist a:hover, #hotspace li a:hover { text-decoration: underline; }:
    / l4 J) N& E; j) _" G* p. y
16. 上面这两行是与鼠标相关
    
17. 
    
18. a img { border: none; }图片连接相关
    0 O7 E" U! B; \/ d
19. 
    
20. 
      r( L9 k3 p$ A0 G. @. x
21. cite:这个一般是引用标签的时候用的,不知道用来这里做什么
    : t/ q' z. f! Z4 m: H7 i
22. 
    
23. 
    ( V$ s+ O4 x9 q
24. font-style:字体式样,一般常用参数有:
    ' X& F" C. F5 Z. l, }, M/ m
25. normal : 正常的字体
    1 A0 a: T/ }' l; u/ J- L$ o9 w- d
26. italic : 斜体。对于没有斜体变量的特殊字体，将应用oblique
    * A6 T2 `8 J8 T! O8 ?
27. oblique : 倾斜的字体
    % Z& o$ |2 C5 i7 V! ~
28. 
    
29. 
    
30. float: right 该属性的值指出了对象是否浮动及如何浮动。常用参数如下:
    
31. none : 　对象不浮动
    
32. left : 　对象浮在左边
    8 J$ [& _& N/ E  O1 X, [9 U3 i
33. right : 　对象浮在右边
    
34. 
    # E7 F6 f# L# {' d1 Z" {$ ~
35. 
    
36. important:样式表条目,提升指定样式规则的应用优先权。
    
37. 
    
38. 
    0 X' U- k7 b8 S( B+ O
39. background: transparent 这个的意思就是背景透明...
    
40. 
    
41. 
    5 U2 \) w7 H" X+ s/ O2 S
42. 
    
43. font-weight: normal :文本字体的粗细,常用参数如下:
    ) x3 d) L0 e/ E0 Y% O
44. normal : 正常的字体。相当于number为400。声明此值将取消之前任何设置
    
45. bold : 粗体。相当于number为700。也相当于b对象的作用
    2 H. K5 C7 L% u
46. bolder : IE5+　特粗体
    
47. lighter : IE5+　细体
    $ V" g& D$ Q) ?# g, R2 I
48. number : IE5+　100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
    
49. 
    5 Q. E6 k) ~$ g. C9 i) x, f- g* u
50. cursor: pointer:这个是鼠标放在对象中的状态,简单点来可以这样说,也就是鼠标放在连接上的时候显示的鼠标形状,一般有以下N种参数,这个真的是TMD的多啊
    6 l, L) j8 U1 N# M% C% h
51. 语法：(每一竖隔开为一个状态)
    : n, g# g* _+ p" i2 A
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)
    
53. 
    * `2 k( ^, v! i" l8 b
54. 
    ; k- N* b/ O; V. X1 }# E( ?
55. 
    
56. 
    - i% W. I9 Q- b. Y+ \& i
57. 
    ) B% j' _- \: P& W* y" e, c$ v
58. 
    # }& t# H; v& }4 U  P5 i( w* R
59. 
    0 n, J; g: @+ b0 m7 N9 R

复制代码

傲天♂浪子追风

1. /*-----------------------------------------------------------------------------------表单通用样式*/
   ! R, N5 L/ p9 U% v$ @& I$ f
2. 
   
3. form { margin: 0; }
   
4.         input, textarea, button, select { font: 1em Arial, Helvetica, sans-serif; }
   
5.         button { height: 1.8em; padding: 0 0.3em; background: #9FC8DF; cursor: pointer; border: 1px solid;
   
6.                 border-top-color: #C9E3F0; border-right-color: #2A8ABA; border-bottom-color: #2A8ABA; border-left-color: #C9E3F0; }
   
7.         fieldset { border: 0; padding: 0; }
   
8.                 legend { display: none; }
   
9.         label { cursor: pointer; margin-right: 0.5em; }
   

复制代码

bronwen

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

傲天♂浪子追风

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

傲天♂疯紫

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