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

傲天♂浪子追风

1. * { word-break: break-all; } /*在IE中实行强制换行*/
   
2. #newsblock { margin-top: 4px; }
   + R, j5 }+ f* R6 g$ S9 p+ d- V
3. /*-----------------------------------------------------------------------------------综合设置*/
   
4. 
   
5. body { margin: 0; background: #FFF; color: #333; text-align: center; font: 12px Arial, Helvetica, sans-serif; }
   9 D9 {! h" m7 t
6. #wrap { background: #FFF; margin: 0 auto; text-align: left; width: 910px; padding: 0 4px; w\idth: 910px; }
   
7. 
   
8. /*链接样式*/
   
9. a { color: #000; text-decoration: none; }
   
10.         a:hover { text-decoration: underline; color: #000098; }
    4 d* X0 N  `% D) \* O' B
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; }
    6 q% s: M' ]+ I0 c  V
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; }
    1 q5 n  e! ]7 P5 @) n3 p/ L0 F  O
18. .more { float: right !important; color: #000098 !important; background: transparent !important; font-size: 12px !important; font-weight: normal !important; cursor: pointer; }
    
19. 
    0 [7 Q. i9 Z5 Q# v5 l
20. /*-----------------------------------------------------------------------------------表单通用样式*/
    7 ^7 k' g% ~* g
21. 
    2 E4 ?" P* J" I( A
22. form { margin: 0; }
    
23.         input, textarea, button, select { font: 1em Arial, Helvetica, sans-serif; }
    ( I5 X7 w) m/ e
24.         button { height: 1.8em; padding: 0 0.3em; background: #9FC8DF; cursor: pointer; border: 1px solid;
    4 d8 M6 U. a4 i% d1 S- r
25.                 border-top-color: #C9E3F0; border-right-color: #2A8ABA; border-bottom-color: #2A8ABA; border-left-color: #C9E3F0; }
    7 [. l# k* j2 B9 d! |( i; c
26.         fieldset { border: 0; padding: 0; }
    
27.                 legend { display: none; }
    
28.         label { cursor: pointer; margin-right: 0.5em; }
    , ?# A4 O. T' s  n& O3 ~
29. 
    
30. /*-----------------------------------------------------------------------------------头部风格 Header*/
    2 ~+ d8 R7 F/ b8 P+ ?* N% w; n6 |
31. /*顶部导航*/
    ) M7 h) ^4 R2 f  A$ x
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; }
    ( Q/ }' ^3 y  W0 E! f+ E
33.         #topmenu ul { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid #86B9D6; }
    ( a# h3 E' G8 o6 b( @3 d9 p
34.                 #topmenu li { display: inline; border-left: 1px solid #86B9D6; padding-left: 1em; padding-right: 0.5em; }
      d5 i: }: e- W# L/ Q: @
35.                         #topmenu a { color: #154BA0; }
    4 Z; C  i# c, n7 `1 \9 r
36. 
    
37. #pagetitle { padding: 8px 0; height: 76px; he\ight: 60px; border-bottom: 4px solid #F5FBFF; }
    % M6 _: P* f( T5 Z9 G* I: p4 Q
38.         #logo { border-right: 1px solid #86B9D6; padding: 0 10px; margin-right: 10px; }
    . |8 j8 `* C, v. D$ c! g  ~  s
39.         .banner468 { float: right; }
    ' e* g2 p" T% W) m* t! _& Q  z0 o
40. 
    / A6 Y. Y+ q3 x9 V% ]0 Y
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; }
    ' P; d5 Z' z; t. N( g
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.         /*首页导航*/
    6 k( r/ s& O6 _# T
46.         #menu dl { margin: 0 1.5em; padding: 0; height: 25px; overflow: hidden; }
    6 y- N) e" F& a: r% O8 g4 D
47.                 #menu dt { float: left; width: 4em; white-space: nowrap; }
    
48.                         #menu dt a { color: #000098 !important; }
    ( C  l5 b" v$ [2 x) G0 j/ z  a
49.                 #menu dd { float: left; width: 6em; margin: 0 2px; overflow: hidden; white-space: nowrap; }
    7 i8 b. K' m5 ]" G  g  h8 ~4 J6 e; s
50. 
    ; h- K: _# O. n' x/ ]
51. /*您的位置导航*/
    
52. #navigation { padding: 1.2em 0; }
    
53.         #navigation p { margin: 0;}
    
54.                 #navigation p a, #navigation p strong { margin: 0 0.5em; }
    $ E) W/ t2 X4 [$ {& w% k. q  V
55.         #searchform { float: right; }
    
56.                 #searchform * { vertical-align: top; }
    
57.                 #searchform button { margin-left: 0.5em; }
    
58. 
    
59.         #navigation.simplepage { padding: 0; border-top: 2px solid #009DEA; border-bottom: 1px solid #009DEA; line-height: 25px; background: #EFF5FF; margin-bottom: 1em; }
    
60.                 #navigation.simplepage p { float: right; margin-right: 0.5em; }
    " n* Y8 {2 t( v8 A& W- _
61.                 .simplepage h2 { margin: 0; font-size: 1.2em; padding-left: 0.5em; }
    
62. 
    
63. /*-----------------------------------------------------------------------------------布局*/
    * T6 D7 M& J' S0 {8 [
64. 
    
65. .content { /*三列布局*/
    ! q4 g; T6 k+ v9 Z! V; }1 G6 L
66.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y 0 0; }
    * c6 P- L2 Y" e+ e8 ^! N+ v1 N0 a
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; }
    " d8 {7 D$ m% `* s0 h- s% z
71. .contentR { /*两列布局，侧边在右侧*/
    
72.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y 580px 0; }
    9 a9 h# }# k: ^+ i) V6 I
73.         /*\*/ * html .contentR { height: 1%; } /**/ *>.contentR { overflow: hidden; }
    
74. /*侧边样式*/
    1 B' m2 K$ S4 n2 p3 q0 Y1 |+ S
75. .sideL { width: 296px; float: left; overflow: hidden; }
    
76. .sideR { width: 202px; float: right; overflow: hidden; }
    
77. /*中间部分样式*/
    
78. .mainarea { margin: 0 4px; width: 382px; float: left; }
    , z1 y6 b+ G" O* ~
79.         .contentL .mainarea { margin: 0 0 0 4px; width: 556px; }
    
80.         .contentR .mainarea { margin: 0 4px 0 0; width: 576px; }
    
81. 
    2 F* C" j$ c, R2 E, d( S5 K
82. /*-----------------------------------------------------------------------------------版块样式*/
    
83. 
    # N+ A5 B' c/ c8 o) C) Y1 }: Y
84. /*版块标题*/
    # P* @4 M4 C5 h) H
85. .blocktitle { clear: both; border: 1px solid #86B9D6; padding: 1px; margin-bottom: 4px; line-height: 30px; }
    3 `( X3 A4 ?3 o' q  w4 v7 g
86.         .blocktitle h2 { font-size: 1.2em; margin: 0; padding: 0 5px; background: #9FC8DF url(../images/new/title_bg.gif) repeat-x; }
    & X( K5 R4 P- ?2 K+ E; c4 W; ]
87.         .blocktitle .more { margin-right: 5px; }
    
88. 
    
89. /*头条信息*/
    
90. #headline { padding: 5px; height: 70px; he\ight: 58px; overflow: hidden; }
    
91.         #headline strong { font-size: 1.2em; }
    - g* G2 N+ L, V5 g, G4 ]* O
92.         #headline p { margin: 0.3em 0; }
    
93.         #headline img { float: right; width: 48px; height: 48px; border: 4px solid #FFF; }
    
94. 
    0 L6 k8 T' \) P* [: u/ f* g, n  {( U, }
95. /*侧边版块*/
    
96. .sideblock { margin: 0 0 3px; border: 1px solid #86B9D6; background: #FFF; padding: 3px; }
    " p1 r( s7 Z& r4 M+ x
97.         .boldblock { padding: 1px; background: #9FC8DF; } /*突出版块*/
    5 k6 O& `3 S- K* p: [8 A/ h3 f5 ^
98.         .cleanblock { border: 1px solid #86B9D6; margin: 0 0 4px; padding: 0; background: #F5FBFF; } /*简单版块*/
    
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%; } /**/
     # r/ B$ J3 L) o9 `. k3 V
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; }
     2 r+ g( u$ c7 S, g) h. `* E; ?
103. 
     , ~2 ?9 F# z+ ]9 m. T
104.         /*侧边多行列表*/
     
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; }
     
108.                 .sideblock dd { color: #999; margin-left: 0.8em; }
     + Y, l- \# ^& }
109.                         .sideblock dd a { color: #999; }
     
110. 
     2 U: K. B% z3 X" [/ e6 D
111. /*单行信息列表*/
     / A  o9 K$ V9 o' T* \
112. .msgtitlelist { margin: 0; padding: 5px 0; list-style: none; line-height: 1.6em; }
     
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; }
     + c% L3 L% k3 w9 U. `
114.         .mainarea .msgtitlelist { font-size: 1.2em; }
     
115.         .sideblock .msgtitlelist { background: #FFF; }
     
116. 
     
117. /*多行信息列表*/
     
118. .messagelist { margin: 5px 0; padding: 0; list-style: none; line-height: 1.6em; }
     1 U2 L" L  F, \6 a1 x- P
119.         .messagelist li { margin: 5px 0 10px 0;}
     
120.                 .messagelist li h4 { margin: 5px 0; font-size: 1em; line-height: 2em; background: #F0F9FF; }
     1 k: i) t. {5 l; z! Q7 t
121.                         .messagelist li h4 a { color: #009; font-size: 1.2em; }
     
122.                                 .messagelist li h4 a:visited { font-weight: normal; }
     6 f* b& e2 c* q) ~  z% e  c- A3 ]* b
123.                 .messagelist li p { margin: 0; }
     ; J; }8 T/ Y$ j8 ?+ ]
124. 
     . J# `% b( _2 h
125.         .messagelist dl { margin: 0; padding: 0; line-height: 1.6em; }
     1 K) a! y1 q6 \( s( p$ u1 h( E) D
126.                 .messagelist dt { background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.7em; padding-left: 0.8em; }
     0 @6 V* q. v3 e( w! M
127.                 .messagelist dd { font-size: 12px; margin: 0; padding-left: 1em; color: #999; }
     5 y& G: A  E, B* X9 e1 y" Q# s
128.                         .messagelist dd a { color: #999; }
     
129. 
     ( k2 P( g9 P& j, g" o' P, v
130. /*热门话题*/
     6 ^  ]  e+ w' i3 q0 Q% i* Y
131. #hottag { overflow: hidden;  }
     6 f: B! b, ]" A9 S$ ^
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; }
     ' Y2 Q* A8 R7 i' }
135.                         #hottag a em { color: #999; font-style: normal; }
     0 D5 W; e+ m& k9 p- T; e+ O; G
136. 
     
137. /*用户面板*/
     ! U- a- W" M$ T' u5 W
138. #userpanel { height: 8.8em; overflow: hidden; }
     
139.         #userpanel form { margin: 5px auto !important; margin: 0 auto; width: 150px; }
     9 ~. q: \& z$ V* ~, o6 h/ P
140.                 #userpanel input { width: 90px; }
     3 p. ~3 x* z! X0 Q
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; }
     , T2 H' d: H% [7 n5 Q
144.         /*登录后*/
     % X) d- _4 b  d) C
145.         #userpanel li { border-bottom: 1px solid #BBE9FF; background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.8em; padding-left: 12px; }
     9 @2 Z' s: y6 I0 \
146.                 #userpanel li a { color: #000098; }
     
147. 
     
148. /*空间之星*/
     
149. #spacestar ul { width: 168px; margin: 0 4px; padding: 0; height: 235px; }
     % c( i0 n# j* }+ |$ _. h
150.         #spacestar li { float: left; display: inline; width: 54px; height: 70px; overflow: hidden; margin: 3px 1px; background: #E2F0F9; text-align: center; }
     6 q" K6 |. e9 N7 g7 z; ?) Q
151.         #spacestar img { width: 48px; height: 48px; margin-top: 3px; }
     ) V% @- d, ]3 Z9 b1 p- C
152.         #spacestar p { margin: -4px 0 !important; margin: 0 0; line-height: 20px; height: 20px; }
     5 a8 o0 E" z$ j/ w9 E. l' R6 i, h+ o
153. 
     
154. /*同城空间*/
     
155. #cityspace { background: #F0F9FF; }
     5 ?5 D+ h* [1 K
156. #cityspace form { width: 10.5em; margin: 0 auto; padding: 5px 0; }
     3 ^1 J. g% j4 [; K# M3 F
157.         #cityspace select { margin: 2px 0; }
     ) Z. O0 u2 X, b% A+ t: _$ k: Z
158.         #cityspace button { float: right; margin-top: 4px; width: 3.5em; height: 3.5em; }
     ( ~/ j, r3 e% E
159.         #blogblock #cityspace { margin: 0 0 4px 0; }
     
160. 
     
161. /*空间排行*/
     & ~+ k3 V. P. W2 X" J
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; }
     " l1 Q* }" r+ Z: ]
164.         #hotspace em { float: right; font-style: normal; font-size: 9px; color: #999; width: 40px; }
     
165. 
     ' ^* B9 E: W' n
166. /*热门文章 */
     
167. #hotarticle { border: 1px solid #86B9D6; background: #E2F0F9; padding: 3px; position: relative; }
     % H% |# E0 @" w4 G. H  U
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; }
     
170.                 #hotarticletabs span { background: #86B9D6; float: right; color: #FFF; margin-right: 2px; height: 18px; padding: 0 5px; cursor: pointer; }
     * C6 j0 d5 L( b* z" y5 O
171.                         #hotarticletabs span.active { background: #FFF; color: #333; border: 1px solid #86B9D6; border-bottom: none; }
     ! M% X7 d# z- z, ?
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. 
     4 k) P: X8 I6 v, G+ l. M% ]" J" g
175. /*图片列表*/
     
176. .imgthumblist { margin: 0 3px; padding: 0; list-style: none; }
     
177.         /*\*/ * html .imgthumblist { height: 1%; }/**/ *>.imgthumblist { overflow: hidden; }
     - N: o! s& m7 _
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; }
     " p: e. \# \: s/ ^
179.                         .imgthumblist li.list1line { height: 123px; height: 115px; }
     
180.                         .imgthumblist li.list2line { height: 143px; height: 135px; }
     * r* F4 e! n* ]1 m5 T% e4 V+ D! n$ H5 g
181.                         .contentL .imgthumblist li { margin: 0 1px 3px; }
     ( a9 n0 u7 {8 x9 U. C
182.                         .imgthumblist img { width: 100px; height: 100px; }
     0 X; U) Z; u6 A# V
183.                         .imgthumblist p { margin: 0; text-align: center; line-height: 1.3em; }
     $ v  B- m( A: q5 E+ U
184.         .throughgallery { width: 100%; clear: both; margin-bottom: 5px; padding-bottom: 3px; background: #E2F0F9; }
     : [- h% a: v4 ~3 [( |- ^
185.                 .throughgallery .imgthumblist { margin: 0; }
     
186.                 .throughgallery .imgthumblist li { height: 120px; margin: 3px 1px; }
     
187. 
     0 u+ d: O  s. ^) T% U. g
188. /*商品*/
     
189. /*\*/ * html .goodsthumblist { height: 1%; } /**/ *>.goodsthumblist { overflow: hidden; }
     
190.         .goodsthumblist { margin: 0; padding: 3px 0; list-style: none; }
     
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; }
     & J4 o1 \- f3 [6 b! h1 M9 V
193.                         .goodsthumblist li p { margin: -3px 0 0 !important; margin: 0; height: 1.5em; line-height 1.5em; overflow: hidden; }
     4 H6 }1 x7 I# M& l( ]2 Q
194. 
     / N' Y7 [% T& ~9 d2 u+ `  N
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; }
     / Q6 f( J; g' ^# m. u8 [
197.                 /*\*/ * html .imgtitlelist li { height: 1%; } /**/ .imgtitlelist>li { overflow: hidden; }
     2 z3 j1 s& T. M2 O" O
198.                         .imgtitlelist li h4 { margin: 0.3em 0; font-size: 1em; }
     4 z7 g/ f5 u# ?4 ?- p
199.                         .imgtitlelist li img { float: left; margin-left: -85px; width: 70px; height: 70px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED; }
     - V, b$ O0 ~1 ^- U9 {/ H1 T. v
200.                         .imgtitlelist li p { margin: 0; line-height: 1.5em; }
     * Z6 B, N* X2 p, s! y6 o8 L
201.         .sideblock .imgtitlelist li { padding-left: 65px; }
     ) [8 H, u% ]0 c9 J/ P3 c8 i
202.                 .sideblock .imgtitlelist li img { width: 48px; height: 48px; margin-left: -60px; }
     
203.        
     9 j1 w5 B! @  p9 }) n0 B
204. 
     ; f- |+ V/ U. \, ?' M
205. /*栏目区块列表*/
     9 e' L7 j$ t! S# ^' v& r' q: m( Z
206. .category {  margin: 4px 0 10px 0; }
     
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; }
     
209.                         .category h3 strong a { color: #333; text-decoration: none; }
     * }" X: O8 d* R6 r: t1 @, u% f
210.         /*.category ul { background: #FFF; margin: 0; padding: 4px 0 0 0; list-style: none; line-height: 1.6em; }
     1 {  C" t# w$ T1 X; H" V
211.                 .category li { padding-left: 0.8em; background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.7em; }
     + g4 m  a; F2 }) a
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; }
     
214. 
     
215. 
     
216. /*-----------------------------------------------------------------------------------首页各版块*/
     
217. 
     
218. /*#commendimage { height: 155px; }
     
219. #topicnews { height: 217px; }
     
220. #newgoods, #commendgoods { height: 200px; }
     : o$ }! d0 J: u+ e4 _9 E
221. #hotcommentfile, #hotfile, #newlink, #hotlink { height: 220px; }*/
     7 ?& ]: x0 \5 Z2 J3 T- X
222. 
     
223. 
     # j- E1 Y$ \2 Z) R: r( g5 b) j! j
224. 
     
225. 
     , Y1 h9 [& u3 d% ^& V* b
226. /*信息列表*/
     
227. .articlelist li { padding-left: 60px; }
     2 _) E: C$ K7 u4 M2 {  U1 M$ @- E9 h6 E5 `
228.         .articlelist h4 img { float: left; margin-left: -60px; width: 48px; height: 48px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED; }
     8 S9 v; Y& ?/ I0 D5 z) V
229. /*.articlelist  h3 a { font-size: 12px; font-weight: normal; margin-left: 1em; color: #B353B3; }
     
230.        
     
231.         .articlelist ul { margin: 0; padding: 0; background: #FFF; padding-left: 5px; list-style: none; }
     
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; }
     6 A" ^& R) y# Z
234.                 .articlelist h4 em { font-style: normal; font-weight: normal; font-size: 0.8em; color: #B353B3; margin-left: 0.3em; }
     8 G" K9 n% `# U4 D8 k
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; }
     0 A. X0 A/ L5 e) ~% `7 ^
237.                
     
238.                 .articlelist li strong { font-weight: normal; color: #999; line-height: 2em; padding-left: 0.5em; }
     
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; }*/
     1 h  k( @8 J1 S1 D
242. 
     
243. 
     
244. .catepic { text-align: center; }
     + ?( c) J- _# w+ e
245.         .catepic img { margin-top: 10px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED;
     * t0 n2 W0 `7 @3 j$ F, t
246.                 max-width: 150px; max-height: 150px; width: expression(this.width > 150 ? 150: true); height: expression(this.height > 150 ? 150: true); }
     0 w7 N, v6 k' |+ O5 M
247.         .catepic p { text-align: left; margin: 0.5em; }
     
248. 
     + o+ ^% C- s" F' i0 R, t) _
249. /*专题列表*/
     
250. #subjectlist { border-color: #86B9D6; padding: 2px; }
     
251.         #subjectlist h3 { border: none; background: #9FC8DF; }
     ) N; u1 E4 y6 x6 N7 y
252.         #subjectlist li { border-bottom: 1px solid #E2F0F9; text-align: center; padding: 3px; }
     3 w% o: N, a/ K- z
253.                 #subjectlist p { margin: 0; line-height: 1.2em; }
     
254. 
     # d( y* h( W! X4 z4 w
255. 
     7 |0 ^. k( c: z) f* M6 `- A8 {
256.         #xspace-rates { height: 2em; }
     * h6 C- q. r( S9 r- n
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; }
     2 g- ^# r- r( j6 B1 u, l' Y' n
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; }
     ' l! M9 L; i! m
261. 
     6 c: K7 H( N( v1 h4 q1 Q
262. 
     / v- V/ I. Y# n* U
263. #panel { width: 600px; overflow: hidden; margin: 1em auto; }
     ! E7 g( u6 F6 E6 d) p
264. 
     7 I8 C  z2 ?& s& c
265. 
     9 }% ]4 {$ h" n" Y8 E' R& D) {
266. /*Pages*/
     ( p3 d/ t# h* r/ T$ }5 P: {
267. .pages { text-align: right; border-top: 1px solid #9FC8DF; }
     " Q; d6 n6 ?0 F, _1 L- S0 d( D6 ^- i8 g
268.         /*.pages table { margin: 3px 0 3px auto; text-align: center; }
     6 ?+ ~. e& D4 B* D9 t8 o3 Y$ ~
269.                 .pages td { padding: 0 5px; border: 1px solid #B9D0ED; background: #FFF; }
     3 n/ x" A. J: @
270.                 .pages a { text-decoration: none; }
     
271.                 .pages .currentpage { background: #F0F9FF; border-color: #86B9D6; font-weight: bold; }*/
       X' f# X- i1 u6 j
272. 
     / S' w9 v! U& d; [+ k- U
273. /* 分页 */
     # R: L0 q0 F- q/ }
274. .xspace-page { margin: 2px 2px 2px auto; }
     
275.         table.xspace-page a { display: block; background: #E2F0F9; padding: 0.3em 0.5em; text-decoration: none; }
     1 }, K1 y( k2 k8 G; E' d
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; }
     - s( K% v; e+ o
278.         table.xspace-page td.xspace-totlerecord, .xspace-page td.xspace-totlepages { background: #E2F0F9; padding: 0.3em 0.5em; }
     0 X! O* K: T% r1 m# O  F
279. 
     : A& x, g* K' b4 X# H; I5 _
280. .smalltxt { font-size: 12px; color: #999; font-weight: normal; }
     0 N  @7 A8 K2 U* r# h# J
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; }
     % V- L2 w1 o: G5 A6 ]6 F
285.         #footer p { margin: 0.3em 0; color: #999; }
     
286.         #footer strong { color: #007AB6; }
     
287.         #footer em { font-style: normal; font-weight: bold; color: #96A800; }
     2 x. y3 Z0 ?, T6 C2 I& ?
288.        
     
289. .imglogolist { margin: 0; padding: 0; list-style: none; text-align: center; }
     ' M" t$ T9 u% I/ Q9 z- q
290.        
     & A7 T2 v/ p+ J- D3 ]- h
291. #articledetail { border: 1px solid #86B9D6; text-align: center; }
     1 h$ B4 F: V( w
292. .articletitle { font-size: 1.6em; margin: 1em 0 0.5em; }
     
293. .articleinfo { border-bottom: 1px solid #9FC8DF; margin: 0;}
     ( J9 O- A' s: h
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; }
     + u+ N* R1 o7 T: l( A9 M/ o0 ~) q
297.         #articlebody * { line-height: normal; }
     - O4 b/ L9 z9 r$ \6 D
298.                 #articlebody  p, #articlebody  div { line-height: 1.8em !important; margin: 10px 0; }
     
299.                         #articlebody  p *, #articlebody  div * { line-height: normal !important; }
     7 K0 E2 F8 [" L
300.        
     9 \# e( d' q& r# N, y! D6 H! Q
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; }
     , |# P- F" D- Z+ t. d
303.                 #articlebody .addoninfo ul { margin: 0.5em 0 0.5em 2em; padding: 0; }
     
304.                         #articlebody .addoninfo li { line-height: 1.6em !important; }
     
305.        
     * L8 E1 G% n- c# [+ }, j' t8 L
306.         #articlebody img { width: expression(this.width > 500 ? 500: true); max-width: 500px;  }
     
307.        
     
308.         #articlebody kbd.showvideo, #articlebody kbd.showflash { font: 1em Arial, Helvetica, sans-serif; cursor: pointer; text-decoration: underline; }
     5 Y( j! }5 t$ _* R8 K6 y
309.         #commentlist { overflow: hidden; border: 1px solid #86B9D6; margin: 4px 0 0; padding: 0 5px; }
     0 @' e: ?4 {/ U' Y7 _6 b. P
310.                 #commentlist h3 { font-size: 1em; line-height: 2em; margin: 0; background: #F0F9FF; border-bottom: 1px solid #86B9D6; }
     6 L3 \' ^5 l$ y. X& h( x1 }6 h6 _9 h
311.                                 #commentlist img { max-width: 500px; width: expression(this.width > 500 ? 500: true); }
     ) _$ r2 [: i" c/ S8 s/ r
312.                         #commentlist .messagelist li div { width: 98%; margin: 0 auto; overflow: hidden; text-align: left; overflow-y: hidden; line-height: 1.8em; }
     
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; }
     . Q& q7 a3 h. O2 d
316. 
     # a8 _, [, c5 c/ W
317. /*发表评论*/
     
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; }
     / v' b% u* m2 P- q# c. S' ^/ v8 y( A
322.         .seccodeline * { vertical-align: middle; }
     ) e" c; Q4 `7 a, X4 y# M
323.         #xspace-rates { height: 2em; }
     . ~  q; X- X$ W5 s# s1 _& {8 E
324.                 #xspace-rates label { float: left; line-height: 24px; margin-right: 5px; }
     ( O; L5 h9 k1 C1 _2 }- \
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; }
     
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; }
     & \/ z8 D: C* r' [; u$ `& V: ^
328. 
     ' f& p5 s2 S4 B
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; }
     
332.                 .xspace-ajaxdiv h5 a { float: right; font-weight: normal; }
     
333.         .xspace-ajaxcontent { background: #FFF; border: 1px solid #EEE; }
     0 a# F5 ?+ X* G8 k; u: |) }* m9 c6 ~
334.                 .xspace-ajaxcontent form { margin: 0; }

复制代码

傲天♂浪子追风

1. /*-----------------------------------------------------------------------------------综合设置*/
   
2. 
   
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; }
   4 X2 k* }6 B& i- N6 K( [  {1 d3 X
5. 
   ( g8 A, K/ i, f" C5 T; f% a0 w

复制代码

$ j5 ]' j/ z( o9 v9 Z
分析

! t! }3 e8 f- K4 }9 q& Q8 F

1. margin属性说明：
   
2. 
   6 E/ ]" R7 T* B7 A
3. 检索或设置对象四边的外延边距。
   
4. 如果提供全部四个参数值，将按上－右－下－左的顺序作用于四边。
   
5. 如果只提供一个，将用于全部的四边。
   
6. 如果提供两个，第一个用于上－下，第二个用于左－右。
   
7. 如果提供三个，第一个用于上，第二个用于左－右，第三个用于下。
   & O7 m7 e; b! y. O: K5 m. n( }
8. 内联对象要使用该属性，必须先设定对象的height或width属性，或者设定position属性为absolute。
   ) K1 j8 o* x( Z& w# f! u/ _
9. 在IE4+，margin属性不可用于td和tr对象。
   
10. 外延边距始终透明。
    % N: H% ^- O! q% _& l3 I  d3 t
11. 
    $ \& i) J$ K( e; h4 D( A
12. color : 　指定颜色
    $ W! p) c5 S, {: t1 O
13. text-align:文本的对齐方式。(left : 　左对齐,right : 　右对齐,center : 　居中,justify : 　两端对齐)
    
14. font: 12px Arial, Helvetica, sans-serif;  :这段是字体相关的
    
15. 
    8 `4 |9 B1 e$ u1 v" a, N9 x( y4 g
16. 
    , d4 q: r4 t1 N  c1 }

复制代码

傲天♂浪子追风

1. /*链接样式*/
   2 p# y- @( |: g: O8 K- l$ T) V
2. a { color: #000; text-decoration: none; }
   $ ]9 s( Q# V" T! P# n. E
3.         a:hover { text-decoration: underline; color: #000098; }
   % r  e3 F7 d. ?9 v
4.                 a:visited { color: #666;}
   8 e+ k& F6 L! i+ }. h+ W5 Y
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; }
   
7.         a img { border: none; }
   - j7 S/ N  \  w+ H1 ^# `
8. li cite { font-style: normal; font-size: 12px; float: right; width: 4em; color: #999; }
   
9.         li cite a { color: #999; }
     n& G2 [8 `+ g+ J
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; }
    ; g, E' L3 h  p
12. 
    ) S9 p0 d2 |, s& d2 i" @

复制代码

, V& a& i) P6 B- m, Z分析
& C& v- s0 H% \7 u- \

1. 
   / s' C6 _& h. d6 Q9 C, i
2. text-decoration:文本连接的属性,一般有以下几种参数:
   
3. none : 　无装饰
   7 L, M1 l$ t, |% B! }, B2 q
4. blink : 　闪烁
   
5. underline : 　下划线
   
6. line-through : 　贯穿线
   ; d3 V- O7 ?7 D- m; i0 O- k
7. overline : 　上划线
   ! r  _. {  k( m- V8 s
8. 
   
9. 
   ' d: Y  B3 I7 z! k
10. hover:设置对象在其鼠标悬停时的样式表属性。
    
11. 
    2 p; S/ g( m7 N  h; V1 h3 k
12. visited:对象在其链接地址已被访问过时的样式表属性。
    $ s! O  ]) L$ k* f0 u
13. 
    9 }# f0 q" z' O+ w+ }
14. #topmenu a, #menu a, .imglist a, #hotspace li a { text-decoration: none; }
    + s0 j, h/ P# e- r8 V4 X7 A% J' |% _% w
15. #topmenu a:hover, #menu a:hover, .imglist a:hover, #hotspace li a:hover { text-decoration: underline; }:
    
16. 上面这两行是与鼠标相关
    7 k) c. f. G/ f; R. X, i  T
17. 
    
18. a img { border: none; }图片连接相关
    
19. 
    
20. 
    " T. E& X. ?, l" ~2 v3 x& m
21. cite:这个一般是引用标签的时候用的,不知道用来这里做什么
    - M8 B4 p) ^. K4 z' F6 i" i$ r
22. 
    ; i4 a4 @) c& T4 u6 o
23. 
    
24. font-style:字体式样,一般常用参数有:
    ! \5 `" c" Y0 s! j! i
25. normal : 正常的字体
    ) \( p/ v7 @8 g1 w" }9 @( K
26. italic : 斜体。对于没有斜体变量的特殊字体，将应用oblique
    & w/ O; C1 o  p. \: w
27. oblique : 倾斜的字体
    
28. 
    
29. 
    % B! D+ Q4 o3 P0 L! F9 d1 X' l
30. float: right 该属性的值指出了对象是否浮动及如何浮动。常用参数如下:
      T7 }. w' i8 i$ P
31. none : 　对象不浮动
    
32. left : 　对象浮在左边
    ! J0 B+ n8 @: `( \+ C
33. right : 　对象浮在右边
    
34. 
    % w- E7 r$ R# i  X( D6 F# t' w% d
35. 
    * [/ _2 ?/ P; }
36. important:样式表条目,提升指定样式规则的应用优先权。
    . j" y- o5 h0 A6 B7 I
37. 
    
38. 
    
39. background: transparent 这个的意思就是背景透明...
    
40. 
    / [  h2 P' g( S  W# h
41. 
    
42. 
    6 `8 j! T. N4 M
43. font-weight: normal :文本字体的粗细,常用参数如下:
    
44. normal : 正常的字体。相当于number为400。声明此值将取消之前任何设置
      l. s3 V  {1 ~/ W/ _
45. bold : 粗体。相当于number为700。也相当于b对象的作用
    
46. bolder : IE5+　特粗体
    
47. lighter : IE5+　细体
    & ~2 M) p# ]1 D) w, N6 \) }
48. number : IE5+　100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
    , g4 |9 n; E2 X1 U- s1 \: J
49. 
    
50. cursor: pointer:这个是鼠标放在对象中的状态,简单点来可以这样说,也就是鼠标放在连接上的时候显示的鼠标形状,一般有以下N种参数,这个真的是TMD的多啊
    
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)
    3 N" X* ]0 U' A1 \' b5 i( a
53. 
    
54. 
    6 r3 `, n2 U. T& f- W
55. 
    
56. 
    ) d( b$ @) _1 G' h7 R
57. 
    
58. 
    
59. 
      M# R5 ^% S# O

复制代码

傲天♂浪子追风

1. /*-----------------------------------------------------------------------------------表单通用样式*/
   
2. 
   0 E$ e% z6 V; u+ o2 s8 n
3. form { margin: 0; }
   4 a: b. Q) X3 e& a: Q- M' I
4.         input, textarea, button, select { font: 1em Arial, Helvetica, sans-serif; }
   # h5 ~" K& B: l1 R, p# F0 R
5.         button { height: 1.8em; padding: 0 0.3em; background: #9FC8DF; cursor: pointer; border: 1px solid;
   0 s$ w: z* e8 x1 X
6.                 border-top-color: #C9E3F0; border-right-color: #2A8ABA; border-bottom-color: #2A8ABA; border-left-color: #C9E3F0; }
   ; G* t  o/ B1 o- ~
7.         fieldset { border: 0; padding: 0; }
   8 b( d# \* Z. o" [" A" r/ b
8.                 legend { display: none; }
   ( \* Q! G' g7 w* Z
9.         label { cursor: pointer; margin-right: 0.5em; }
   

复制代码

bronwen

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

傲天♂浪子追风

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

傲天♂疯紫

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