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

傲天♂浪子追风

1. * { word-break: break-all; } /*在IE中实行强制换行*/
   
2. #newsblock { margin-top: 4px; }
   , _7 Q4 g- L8 K  f
3. /*-----------------------------------------------------------------------------------综合设置*/
   2 {0 s3 \" a, S, }0 J6 K, y4 e
4. 
   4 \& i9 ]/ N) Y- t/ T$ z0 W
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. 
   4 ^6 L1 Y0 f& a% q0 f. E
8. /*链接样式*/
   % n1 k1 [1 y* [# A1 d# d
9. a { color: #000; text-decoration: none; }
   3 m( V; Y: a. g
10.         a:hover { text-decoration: underline; color: #000098; }
    # P1 i8 E# `0 f& ]* }7 V$ j/ H
11.                 a:visited { color: #666;}
    # ^5 |1 `! U  ?
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; }
    
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 M& J; B( G, H
18. .more { float: right !important; color: #000098 !important; background: transparent !important; font-size: 12px !important; font-weight: normal !important; cursor: pointer; }
    
19. 
    
20. /*-----------------------------------------------------------------------------------表单通用样式*/
      w# e8 Z$ y& \: @3 [0 z
21. 
    ! q. g; {: ?" \+ c+ I9 @5 n" e
22. form { margin: 0; }
    ! j; ~8 F' W& D$ O4 t! h& F
23.         input, textarea, button, select { font: 1em Arial, Helvetica, sans-serif; }
      Y+ i- W. Z" l% S
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; }
    : ]& f$ N" Q. C2 G4 Y6 z& k: E1 X+ T
28.         label { cursor: pointer; margin-right: 0.5em; }
    / X; o) ~/ Q) C9 N) \
29. 
    
30. /*-----------------------------------------------------------------------------------头部风格 Header*/
    6 M6 B: x! L) J7 N' A1 |
31. /*顶部导航*/
    
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; }
    * l# G) e. ]7 ~/ M) M
33.         #topmenu ul { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid #86B9D6; }
    4 _5 ^! J: J$ k' X% N- m4 F. N/ F! S
34.                 #topmenu li { display: inline; border-left: 1px solid #86B9D6; padding-left: 1em; padding-right: 0.5em; }
    6 W. [2 P1 i( p- {% O
35.                         #topmenu a { color: #154BA0; }
    ) V/ ^. t2 N* `) Z
36. 
    7 J6 z9 t5 S5 f# ]" V. n
37. #pagetitle { padding: 8px 0; height: 76px; he\ight: 60px; border-bottom: 4px solid #F5FBFF; }
    9 O( a3 k4 H& s* z
38.         #logo { border-right: 1px solid #86B9D6; padding: 0 10px; margin-right: 10px; }
    
39.         .banner468 { float: right; }
    5 x) P% z2 U6 ]8 C( J; o3 F. K4 Y
40. 
    ' K$ R' X) M* y* e! Z% z
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 m& F- u1 r1 B) ]3 `4 |! ?
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 t: \1 K! z/ K- x9 \
46.         #menu dl { margin: 0 1.5em; padding: 0; height: 25px; overflow: hidden; }
    ! K1 D# H" f3 W
47.                 #menu dt { float: left; width: 4em; white-space: nowrap; }
    
48.                         #menu dt a { color: #000098 !important; }
    7 i+ ~6 o7 Q. u* j2 m) j$ d
49.                 #menu dd { float: left; width: 6em; margin: 0 2px; overflow: hidden; white-space: nowrap; }
    
50. 
    ) ~9 t, g" r0 d) i0 S
51. /*您的位置导航*/
    
52. #navigation { padding: 1.2em 0; }
    - B/ k2 V* w+ e! l, d4 U
53.         #navigation p { margin: 0;}
    
54.                 #navigation p a, #navigation p strong { margin: 0 0.5em; }
    3 {/ j: z: P! r( J* X$ @2 W
55.         #searchform { float: right; }
    
56.                 #searchform * { vertical-align: top; }
    5 |/ W5 [. P) F. n. ^# ~
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; }
    " g6 n7 h6 Z% a& [. a, u
60.                 #navigation.simplepage p { float: right; margin-right: 0.5em; }
    . Y  |* q3 |8 z# ~
61.                 .simplepage h2 { margin: 0; font-size: 1.2em; padding-left: 0.5em; }
    . S% s% U# g% f1 F- a
62. 
    1 t% E) l# {$ a) \0 E
63. /*-----------------------------------------------------------------------------------布局*/
    
64. 
    1 [; g. F" G  |" u2 s
65. .content { /*三列布局*/
    1 }, Q) x1 Z3 N
66.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y 0 0; }
    ; D  |0 R! G1 _! e, ^6 M4 q8 @
67.         /*\*/ * html .content { height: 1%; } /**/ *>.content { overflow: hidden; }
    
68. .contentL { /*两列布局，侧边在左侧*/
    4 p# t4 r* j0 r! b' t6 _
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; }
    
73.         /*\*/ * html .contentR { height: 1%; } /**/ *>.contentR { overflow: hidden; }
    ) Y% w( X6 G: m+ _. N! k
74. /*侧边样式*/
    
75. .sideL { width: 296px; float: left; overflow: hidden; }
    / |8 q/ \: g" d& U3 z8 }3 z
76. .sideR { width: 202px; float: right; overflow: hidden; }
    . A' Q3 k& d. U4 D6 a
77. /*中间部分样式*/
    % E4 ?, @/ C8 `1 Q
78. .mainarea { margin: 0 4px; width: 382px; float: left; }
    
79.         .contentL .mainarea { margin: 0 0 0 4px; width: 556px; }
    7 r$ Z1 k% b0 h9 i
80.         .contentR .mainarea { margin: 0 4px 0 0; width: 576px; }
    : V9 F! x7 ~0 {7 m  Q, \7 B
81. 
    
82. /*-----------------------------------------------------------------------------------版块样式*/
    
83. 
    ( W2 x  }1 X$ D! X4 E. e+ O
84. /*版块标题*/
    7 D6 ]$ ]4 B$ ]- n* `3 Q
85. .blocktitle { clear: both; border: 1px solid #86B9D6; padding: 1px; margin-bottom: 4px; line-height: 30px; }
    2 P7 p. A% T" a
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; }
    
88. 
    " k7 t! {3 }9 r1 |( n
89. /*头条信息*/
    4 M% H1 U; j3 i( ~- ~
90. #headline { padding: 5px; height: 70px; he\ight: 58px; overflow: hidden; }
    * d6 l2 D7 K$ \2 r6 E$ O* E2 |5 b
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; }
    7 y/ w5 _; W: N; ]! M7 D
94. 
    
95. /*侧边版块*/
    . _# z1 }+ k% @2 o' n! o
96. .sideblock { margin: 0 0 3px; border: 1px solid #86B9D6; background: #FFF; padding: 3px; }
    
97.         .boldblock { padding: 1px; background: #9FC8DF; } /*突出版块*/
    
98.         .cleanblock { border: 1px solid #86B9D6; margin: 0 0 4px; padding: 0; background: #F5FBFF; } /*简单版块*/
    4 L/ |$ D+ W' c
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; }
     4 E7 Z$ M# N. D
102.                         .headimg { float: right; margin: 5px 0 2px 5px; width: 80px; height: 80px; border: 4px solid #E2F0F9; }
     8 p2 G% F4 ~# |+ q* A
103. 
     " Z2 ]' J, {- ~: n8 ?
104.         /*侧边多行列表*/
     % U; c9 d/ n4 p5 d* H+ w: E3 e! r
105.         .sideblock dl { margin: 0; padding: 5px; background: #FFF; line-height: 1.8em; }
     
106.                 /*\*/ * html .sideblock dl { position: relative; } /**/
     % D' ^% y  @7 O5 t5 W/ B
107.                 .sideblock dt { padding-left: 0.8em; background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.7em; }
     1 A' K( x! |3 ]) N: [0 Z) i/ f2 e
108.                 .sideblock dd { color: #999; margin-left: 0.8em; }
     % `7 l3 Y/ @4 Z) e+ H% O+ B8 r
109.                         .sideblock dd a { color: #999; }
     : K( P. i- _# k1 f5 N. W1 k
110. 
     
111. /*单行信息列表*/
     / }( Q' a( G0 A, g
112. .msgtitlelist { margin: 0; padding: 5px 0; list-style: none; line-height: 1.6em; }
     ' h. |6 `" v- G" [+ X1 h( n
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; }
     7 f' m. _9 U8 z' i& C' y& Y# F& F7 }, P
115.         .sideblock .msgtitlelist { background: #FFF; }
     : Z" ?' P* s7 b: V# S( O6 g2 O6 l# ~7 e
116. 
     # g. P! p$ ]9 S4 i% u$ i7 C6 V8 p
117. /*多行信息列表*/
     
118. .messagelist { margin: 5px 0; padding: 0; list-style: none; line-height: 1.6em; }
     4 _. Y# k& J0 ~% _" z1 n3 i! d
119.         .messagelist li { margin: 5px 0 10px 0;}
     7 Z3 u1 _, E2 ?1 N: g
120.                 .messagelist li h4 { margin: 5px 0; font-size: 1em; line-height: 2em; background: #F0F9FF; }
     1 E$ N' o" f7 B6 f
121.                         .messagelist li h4 a { color: #009; font-size: 1.2em; }
     
122.                                 .messagelist li h4 a:visited { font-weight: normal; }
     6 Q' O% D; f7 u: K- K$ \5 Q
123.                 .messagelist li p { margin: 0; }
     ' a2 z6 p$ l4 @& z6 k" u# {
124. 
     
125.         .messagelist dl { margin: 0; padding: 0; line-height: 1.6em; }
     # D# h; n' }( f
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; }
     
128.                         .messagelist dd a { color: #999; }
     
129. 
     7 v1 |4 m8 ^0 E2 C6 [' ]  h
130. /*热门话题*/
     ) k6 E$ t$ c1 R* c7 d. o
131. #hottag { overflow: hidden;  }
     5 p$ ~4 G2 c0 e7 W' U
132.         #hottag div { background: #FFF; padding: 0.5em; overflow: hidden; line-height: 1.8em; }
     & [3 n& `$ r6 h/ ?  L% Y) t% R
133.                 #hottag div { color: #999; overflow: hidden; }
     ; G3 ]- p% {' j
134.                 #hottag a { margin-right: 0.2em; white-space: nowrap; }
     
135.                         #hottag a em { color: #999; font-style: normal; }
     6 \0 ?& C  D; ]* ~
136. 
     ( {' U& S$ u0 `4 Q
137. /*用户面板*/
     / _" |. Q9 w) R5 D3 {, s
138. #userpanel { height: 8.8em; overflow: hidden; }
     
139.         #userpanel form { margin: 5px auto !important; margin: 0 auto; width: 150px; }
     
140.                 #userpanel input { width: 90px; }
     
141.                 #userpanel p { margin: 0.5em 0; }
     
142.                 #dologin { float: right; }
     5 B2 ^; u0 p" J/ Y7 x
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; }
     3 C  u& I& |; j5 Q! D$ F& z
147. 
       s. b! a( Q% B# f( I; n% ?" E
148. /*空间之星*/
     ! l* K1 M# Q. F
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; }
     & ?' g& h& I0 K5 ]% T- F. X
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; }
     2 P5 ~) D% E7 \6 v; }, a( X" A# T
153. 
     
154. /*同城空间*/
     
155. #cityspace { background: #F0F9FF; }
     6 B$ @+ K( X! i) P
156. #cityspace form { width: 10.5em; margin: 0 auto; padding: 5px 0; }
     
157.         #cityspace select { margin: 2px 0; }
     
158.         #cityspace button { float: right; margin-top: 4px; width: 3.5em; height: 3.5em; }
     
159.         #blogblock #cityspace { margin: 0 0 4px 0; }
     6 L, ^: y9 b" {0 _% G7 B& Y
160. 
     / l- W2 Z" x3 _5 q; [& F, E: r
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; }
     5 ?3 h9 X9 k/ ^6 i& H# v6 M
163.         #hotspace li { height: 20px; overflow: hidden; }
     + [/ D7 J2 H1 v4 @6 N2 c
164.         #hotspace em { float: right; font-style: normal; font-size: 9px; color: #999; width: 40px; }
     
165. 
     
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; }
     2 U% P1 V7 U! W, Y  U
170.                 #hotarticletabs span { background: #86B9D6; float: right; color: #FFF; margin-right: 2px; height: 18px; padding: 0 5px; cursor: pointer; }
     - V; X- a+ A% {. b( |1 }- q3 d; x0 r
171.                         #hotarticletabs span.active { background: #FFF; color: #333; border: 1px solid #86B9D6; border-bottom: none; }
       O8 p  B* o5 g: v
172.         #hotarticle ul { background: #FFF; margin: 0; padding: 0.5em; list-style: none; line-height: 1.7em; height: 16.5em; overflow: hidden; }
     0 w8 a, [+ J" f
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; }
     ) h8 Q8 G' S3 {* d
174. 
     
175. /*图片列表*/
     ( u7 Q0 t( A0 S5 W' R
176. .imgthumblist { margin: 0 3px; padding: 0; list-style: none; }
     
177.         /*\*/ * html .imgthumblist { height: 1%; }/**/ *>.imgthumblist { overflow: hidden; }
       v3 ^+ T5 Q( R" F7 A
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; }
     + V0 y0 B4 A9 u% z+ f
179.                         .imgthumblist li.list1line { height: 123px; height: 115px; }
     
180.                         .imgthumblist li.list2line { height: 143px; height: 135px; }
     
181.                         .contentL .imgthumblist li { margin: 0 1px 3px; }
     
182.                         .imgthumblist img { width: 100px; height: 100px; }
     
183.                         .imgthumblist p { margin: 0; text-align: center; line-height: 1.3em; }
     6 ?! p& H# P+ ?, p! w+ I/ [
184.         .throughgallery { width: 100%; clear: both; margin-bottom: 5px; padding-bottom: 3px; background: #E2F0F9; }
     . ]1 c9 q) G1 K! Q4 q' k- {, q
185.                 .throughgallery .imgthumblist { margin: 0; }
     + |) L* Q3 N' [$ K. a( F' ?
186.                 .throughgallery .imgthumblist li { height: 120px; margin: 3px 1px; }
     
187. 
     6 {) P6 p( U& C6 T+ U7 X/ p; b, X
188. /*商品*/
     
189. /*\*/ * html .goodsthumblist { height: 1%; } /**/ *>.goodsthumblist { overflow: hidden; }
     ( D% Q* q* N# D- V: W
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; }
     
193.                         .goodsthumblist li p { margin: -3px 0 0 !important; margin: 0; height: 1.5em; line-height 1.5em; overflow: hidden; }
     , G( @+ t1 f* P
194. 
     
195. .imgtitlelist { margin: 10px 0; padding: 0; list-style: none; }
     3 k4 \; O, D, ^
196.                 .imgtitlelist li { padding-left: 85px; padding-bottom: 5px; margin: 5px 0; border-bottom: 1px solid #E2F0F9; }
     ! o- Y" w* U* W% O# s
197.                 /*\*/ * html .imgtitlelist li { height: 1%; } /**/ .imgtitlelist>li { overflow: hidden; }
     
198.                         .imgtitlelist li h4 { margin: 0.3em 0; font-size: 1em; }
     , t6 D5 \, x; r! n
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; }
     $ v8 `  `7 W2 c! u6 w& Y% F9 }
201.         .sideblock .imgtitlelist li { padding-left: 65px; }
     
202.                 .sideblock .imgtitlelist li img { width: 48px; height: 48px; margin-left: -60px; }
     # u& @, h' G& A7 M. n
203.        
     % ^- r! E& T6 _/ f7 B0 ]3 J  Z6 c
204. 
     
205. /*栏目区块列表*/
       I3 y, ^/ }1 H/ Y* z  P; j& _: X
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; }
     # _7 k0 }$ a$ C2 D" l' u9 a; |
208.                 .category h3 strong { background: #E9ECEF; float: left; padding: 0 8px; }
     
209.                         .category h3 strong a { color: #333; text-decoration: none; }
     
210.         /*.category ul { background: #FFF; margin: 0; padding: 4px 0 0 0; list-style: none; line-height: 1.6em; }
     1 R" Y( ~* {7 j4 E! Q, Q5 z- k+ P
211.                 .category li { padding-left: 0.8em; background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.7em; }
     3 y2 o5 _+ v* \+ D' w7 G" v
212.         .catecommend { background: #F0F9FF; margin: 0; line-height: 2em; height: 2em; overflow: hidden; padding: 0 1em; }*/
     4 Z) L+ q7 r& B4 \. {
213.                 .catecommend a { color: #000099; white-space: nowrap; margin-right: 0.5em; }
     
214. 
     , Z$ `4 ~5 t* G, s
215. 
     . M( S2 M1 O9 q& o1 }5 J
216. /*-----------------------------------------------------------------------------------首页各版块*/
     ' P! c- ~. G, _% {6 c8 ]
217. 
     
218. /*#commendimage { height: 155px; }
     
219. #topicnews { height: 217px; }
     8 g* |6 W/ C3 l9 @+ O
220. #newgoods, #commendgoods { height: 200px; }
     
221. #hotcommentfile, #hotfile, #newlink, #hotlink { height: 220px; }*/
     
222. 
     
223. 
     ) Z. d  x0 _1 k( x
224. 
     7 F9 \  n+ R0 _- \1 M: V8 G
225. 
     
226. /*信息列表*/
     
227. .articlelist li { padding-left: 60px; }
     
228.         .articlelist h4 img { float: left; margin-left: -60px; width: 48px; height: 48px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED; }
     4 `1 v( A2 N' S3 e. y0 _
229. /*.articlelist  h3 a { font-size: 12px; font-weight: normal; margin-left: 1em; color: #B353B3; }
     
230.        
     . e& U; h$ A5 n. f! f$ t
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; }
     % q' V( m- ]+ n2 Y+ y1 h- i
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; }
     + O; Y" `. G5 x5 _& W1 ~
235.                 .articlelist h4 a { color: #000099; }
     0 t$ L6 J" I7 o9 c) S  s
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; }
     
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 S2 N- u1 I9 I6 [) \% O
242. 
     % _  O8 M% d; A  L  C
243. 
     
244. .catepic { text-align: center; }
     
245.         .catepic img { margin-top: 10px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED;
     ( K3 m; }0 f, z* f
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. 
     , b0 B3 K" {7 W9 I2 l5 K
249. /*专题列表*/
     9 U( }: J/ \$ U& q
250. #subjectlist { border-color: #86B9D6; padding: 2px; }
     + x: S6 w, b' N/ M* O/ R5 F
251.         #subjectlist h3 { border: none; background: #9FC8DF; }
     8 W0 d) E7 A+ V+ q) I
252.         #subjectlist li { border-bottom: 1px solid #E2F0F9; text-align: center; padding: 3px; }
     
253.                 #subjectlist p { margin: 0; line-height: 1.2em; }
     
254. 
     
255. 
     5 H# Q3 V1 t3 l: a1 B5 v( O
256.         #xspace-rates { height: 2em; }
     % ?$ D4 J) k; Q4 b( I# Q
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; }
     . L+ M, F* S. V' t1 s
261. 
     4 T) D3 ?4 K, o& v! J# |
262. 
     2 G7 k) W* y% U3 g, H- x! O; {
263. #panel { width: 600px; overflow: hidden; margin: 1em auto; }
     
264. 
     , v, h0 K) L; J
265. 
     
266. /*Pages*/
     % Q  v4 D4 A0 q# Q8 e6 X2 c
267. .pages { text-align: right; border-top: 1px solid #9FC8DF; }
     
268.         /*.pages table { margin: 3px 0 3px auto; text-align: center; }
       E, F, e" F$ r
269.                 .pages td { padding: 0 5px; border: 1px solid #B9D0ED; background: #FFF; }
     - `; X0 @' d1 L" y5 W  H( F
270.                 .pages a { text-decoration: none; }
     4 ?% ~' _& @: N7 ~9 O
271.                 .pages .currentpage { background: #F0F9FF; border-color: #86B9D6; font-weight: bold; }*/
     * X0 p- ]+ K6 A/ Q4 {* j
272. 
     0 i7 l7 n5 p% e! c
273. /* 分页 */
     ! q: |) ]& L" B& p6 B  t) }) ?  E
274. .xspace-page { margin: 2px 2px 2px auto; }
     1 V4 ]# A1 G4 S) l: c( I
275.         table.xspace-page a { display: block; background: #E2F0F9; padding: 0.3em 0.5em; text-decoration: none; }
     ( w4 n+ |0 f( U1 I- K8 A
276.                 table.xspace-page a:hover { background: #86B9D6; }
     3 N. u+ ~* L' T& t3 r* F
277.         table.xspace-page td.xspace-current { background: #86B9D6; padding: 0.3em 0.5em; font-weight: bold; }
     % r1 _% n( X7 G  u8 Y2 A; f; R/ J
278.         table.xspace-page td.xspace-totlerecord, .xspace-page td.xspace-totlepages { background: #E2F0F9; padding: 0.3em 0.5em; }
     
279. 
       e0 L" D; S& _" @
280. .smalltxt { font-size: 12px; color: #999; font-weight: normal; }
     
281.         .smalltxt a, .smalltxt a:visited { color: #999 !important; }
     ' w; ?9 I+ e* i4 i
282. 
     
283. /*-----------------------------------------------------------------------------------页脚 Footer*/
     2 D: @& P5 _4 ^
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; }
     
287.         #footer em { font-style: normal; font-weight: bold; color: #96A800; }
     
288.        
     
289. .imglogolist { margin: 0; padding: 0; list-style: none; text-align: center; }
       m  U0 V- \9 D5 r: x+ c+ o9 ?
290.        
     $ a  t( C  z: w) D( i! Q% n
291. #articledetail { border: 1px solid #86B9D6; text-align: center; }
     
292. .articletitle { font-size: 1.6em; margin: 1em 0 0.5em; }
     3 B+ L/ L! }+ W$ k* z
293. .articleinfo { border-bottom: 1px solid #9FC8DF; margin: 0;}
     
294. .articlectrl { margin: 0.5em 0 1.5em; }
     5 G+ _% ]! Z' j! Y4 R, X
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; }
     ! O  p- a1 _% \9 C7 v# a! d
298.                 #articlebody  p, #articlebody  div { line-height: 1.8em !important; margin: 10px 0; }
     , c* j9 Q0 T- K( V0 a
299.                         #articlebody  p *, #articlebody  div * { line-height: normal !important; }
     # {1 F. G, S+ c8 Z
300.        
     
301.         #articlebody .addoninfo { border: 1px solid #EEE; }
     ( l0 F. @/ X& b2 }* N) b
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; }
     1 x, \! a8 u) }6 ?) u# }* ]" U( e
305.        
     ( B4 a4 {( E) Q% u1 [, M- F( g* K8 }
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; }
     
309.         #commentlist { overflow: hidden; border: 1px solid #86B9D6; margin: 4px 0 0; padding: 0 5px; }
     - z" y, H; d) y1 u* X
310.                 #commentlist h3 { font-size: 1em; line-height: 2em; margin: 0; background: #F0F9FF; border-bottom: 1px solid #86B9D6; }
     6 r! a. Q$ ]. r" J, J' ^! Z
311.                                 #commentlist img { max-width: 500px; width: expression(this.width > 500 ? 500: true); }
     ! B- t. S: T* {( H
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; }
     
316. 
     9 ^5 j8 i1 _5 ?# [. k1 H
317. /*发表评论*/
     
318. #comment { margin-top: 4px; }
     + J& Y. K6 D' S0 g
319.         #comment h3 { margin: 0 5px; font-size: 1em; line-height: 2em; }
     " ~& t4 H3 G+ Q+ m- C
320.         #comment form { background: #FFF; margin: 0; padding: 5px; }
     ' ~0 \) O. p6 [% G/ C2 M
321.         #comment p { margin: 0.3em 0; }
     
322.         .seccodeline * { vertical-align: middle; }
     - Y# I/ j2 F9 L% ^  t* S  _
323.         #xspace-rates { height: 2em; }
     
324.                 #xspace-rates label { float: left; line-height: 24px; margin-right: 5px; }
     6 a* ^' u& s7 |  H- q; l
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; }
     . C' F: B& V" ]; ]7 k2 f  b
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; }
     + F  x% ^* M' Y5 n- T
328. 
     
329. /*AJAX div*/
     . ?0 A3 K: G9 M& u3 {7 x4 r
330. .xspace-ajaxdiv { position:absolute; padding: 5px; border: 1px solid #BBB; background: #FCFFEF; text-align: left; }
     5 q# P1 A# y0 P8 h' o
331.         .xspace-ajaxdiv h5 { line-height: 24px; font-size: 1em; margin: 0; }
     3 ~7 F- c" P0 M$ t
332.                 .xspace-ajaxdiv h5 a { float: right; font-weight: normal; }
     + {; D/ x# }7 N0 n
333.         .xspace-ajaxcontent { background: #FFF; border: 1px solid #EEE; }
     
334.                 .xspace-ajaxcontent form { margin: 0; }

复制代码

傲天♂浪子追风

1. /*-----------------------------------------------------------------------------------综合设置*/
   9 S1 l# g" Z4 `  E& N* B1 f5 i$ w
2. 
   % b6 t( P: e. z$ S. \( C& V
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; }
   
5. 
   

复制代码

. B( C) j0 s( g2 u; e
$ {0 F6 M" G9 R, c9 g2 J分析

1. margin属性说明：
   1 [( N; v' F2 t( G- j& B( }! G
2. 
   
3. 检索或设置对象四边的外延边距。
   
4. 如果提供全部四个参数值，将按上－右－下－左的顺序作用于四边。
   6 p9 F7 x% r- [8 J9 a2 a
5. 如果只提供一个，将用于全部的四边。
   
6. 如果提供两个，第一个用于上－下，第二个用于左－右。
   5 W( @) e( y( M( I
7. 如果提供三个，第一个用于上，第二个用于左－右，第三个用于下。
   8 w* b" I8 U' P2 C) U4 J3 |
8. 内联对象要使用该属性，必须先设定对象的height或width属性，或者设定position属性为absolute。
   
9. 在IE4+，margin属性不可用于td和tr对象。
   
10. 外延边距始终透明。
    
11. 
    
12. color : 　指定颜色
    / V% P! I+ s2 g/ u, o. a
13. text-align:文本的对齐方式。(left : 　左对齐,right : 　右对齐,center : 　居中,justify : 　两端对齐)
    0 v6 H+ U8 I, R* g/ z
14. font: 12px Arial, Helvetica, sans-serif;  :这段是字体相关的
    
15. 
    $ H) l- g6 Z" ^6 d6 j, K# ^
16. 
    

复制代码

傲天♂浪子追风

1. /*链接样式*/
   $ u0 b- `2 s  x
2. a { color: #000; text-decoration: none; }
   3 D; H7 G# \! f  L5 {$ d
3.         a:hover { text-decoration: underline; color: #000098; }
   
4.                 a:visited { color: #666;}
   
5.         #topmenu a, #menu a, .imglist a, #hotspace li a { text-decoration: none; }
   $ K0 h% _) B- p6 E. B
6.                 #topmenu a:hover, #menu a:hover, .imglist a:hover, #hotspace li a:hover { text-decoration: underline; }
   
7.         a img { border: none; }
     {, I. p5 N8 {( G. I+ z
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; }
    2 ~9 C5 q% K9 v. {& |
11. .more { float: right !important; color: #000098 !important; background: transparent !important; font-size: 12px !important; font-weight: normal !important; cursor: pointer; }
    ' H3 B& T, z6 l
12. 
    

复制代码

7 S/ e& G2 _) W: J) u5 `  c分析
' X9 j1 T, k$ Z+ M2 j0 K

1. 
   ; X% O2 V+ X5 i; Y, j" N5 E
2. text-decoration:文本连接的属性,一般有以下几种参数:
   
3. none : 　无装饰
   
4. blink : 　闪烁
   
5. underline : 　下划线
   
6. line-through : 　贯穿线
   & t5 r5 {5 M! i6 m/ q9 V
7. overline : 　上划线
   
8. 
   
9. 
   % _. p2 ~" r1 O" e- U0 w
10. hover:设置对象在其鼠标悬停时的样式表属性。
    $ S0 d- z; D7 s6 u. a$ `7 r
11. 
    ; ~# t4 y- _" Z8 B( x  k0 f
12. visited:对象在其链接地址已被访问过时的样式表属性。
    
13. 
    
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; }:
    
16. 上面这两行是与鼠标相关
    
17. 
    
18. a img { border: none; }图片连接相关
    - R4 q/ c  w8 k5 e, f$ Y
19. 
      c/ F1 Y! ^3 Z9 E
20. 
      t* g4 _1 {% n. J9 y' N+ x2 m
21. cite:这个一般是引用标签的时候用的,不知道用来这里做什么
    ! K  P2 H! z: f
22. 
    - j* s/ Y# Z; Z8 e
23. 
    4 v3 E# |0 K& `$ L' w% D' V2 }5 \
24. font-style:字体式样,一般常用参数有:
    0 t7 _7 z: i5 U* G
25. normal : 正常的字体
    
26. italic : 斜体。对于没有斜体变量的特殊字体，将应用oblique
    ' A1 v9 h( C) k+ n. s
27. oblique : 倾斜的字体
    
28. 
    " a: r4 R/ }, `6 `9 F
29. 
    ; {# i( }" g$ @
30. float: right 该属性的值指出了对象是否浮动及如何浮动。常用参数如下:
    
31. none : 　对象不浮动
    
32. left : 　对象浮在左边
    / `0 u4 B% R# q
33. right : 　对象浮在右边
    
34. 
    
35. 
    
36. important:样式表条目,提升指定样式规则的应用优先权。
    , k: k- U6 M  U' J
37. 
    ) m9 z7 W% F. E
38. 
    ) ~. F0 |! e' x
39. background: transparent 这个的意思就是背景透明...
    & T9 l. m$ f7 [' A  d+ S6 ~- k
40. 
    ! n" l: H/ H+ `. z; U
41. 
    6 [& p! j: m& p1 f; z; ^
42. 
    5 u8 F- ]6 j6 f8 A! }/ g8 ^
43. font-weight: normal :文本字体的粗细,常用参数如下:
    
44. normal : 正常的字体。相当于number为400。声明此值将取消之前任何设置
    
45. bold : 粗体。相当于number为700。也相当于b对象的作用
    
46. bolder : IE5+　特粗体
    6 B$ @( ~4 j2 b% Y6 n5 F+ G( D, K
47. lighter : IE5+　细体
    
48. number : IE5+　100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
    
49. 
    
50. cursor: pointer:这个是鼠标放在对象中的状态,简单点来可以这样说,也就是鼠标放在连接上的时候显示的鼠标形状,一般有以下N种参数,这个真的是TMD的多啊
      R) @' c) j7 n
51. 语法：(每一竖隔开为一个状态)
    ) u9 h2 B! u" ~
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. 
    
54. 
    
55. 
    
56. 
    
57. 
    . p: U' G  y" i5 i5 d8 u
58. 
    
59. 
    4 S/ D" w) J' m! i4 H) `! j

复制代码

傲天♂浪子追风

1. /*-----------------------------------------------------------------------------------表单通用样式*/
   
2. 
   ! Z) z, @( i! O$ i
3. form { margin: 0; }
   
4.         input, textarea, button, select { font: 1em Arial, Helvetica, sans-serif; }
   $ X* x/ o. _6 L. p
5.         button { height: 1.8em; padding: 0 0.3em; background: #9FC8DF; cursor: pointer; border: 1px solid;
   / a, U$ L* _) `- y$ Q0 |( [$ o
6.                 border-top-color: #C9E3F0; border-right-color: #2A8ABA; border-bottom-color: #2A8ABA; border-left-color: #C9E3F0; }
   
7.         fieldset { border: 0; padding: 0; }
   . i- p, I5 h6 \6 r4 E0 V5 ^9 N! P+ R
8.                 legend { display: none; }
   
9.         label { cursor: pointer; margin-right: 0.5em; }
   ( E3 x' l& `2 \- j, N1 v

复制代码

bronwen

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

傲天♂浪子追风

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

傲天♂疯紫

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