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

傲天♂浪子追风

1. * { word-break: break-all; } /*在IE中实行强制换行*/
   0 \# }8 U8 j# N
2. #newsblock { margin-top: 4px; }
   # J+ j/ Q4 B/ g/ w' _( @
3. /*-----------------------------------------------------------------------------------综合设置*/
   
4. 
   % B# w9 p$ Y6 ~1 |6 @2 E
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. 
   
8. /*链接样式*/
   * b1 F$ c5 h  u3 {$ D$ V! j
9. a { color: #000; text-decoration: none; }
   
10.         a:hover { text-decoration: underline; color: #000098; }
    
11.                 a:visited { color: #666;}
    
12.         #topmenu a, #menu a, .imglist a, #hotspace li a { text-decoration: none; }
    
13.                 #topmenu a:hover, #menu a:hover, .imglist a:hover, #hotspace li a:hover { text-decoration: underline; }
    
14.         a img { border: none; }
    
15. li cite { font-style: normal; font-size: 12px; float: right; width: 4em; color: #999; }
    2 e0 T+ t: l0 |  _0 E  o
16.         li cite a { color: #999; }
    
17.                 li cite a:visited { color: #999; }
    8 j; P8 H/ w& O9 T! P; d
18. .more { float: right !important; color: #000098 !important; background: transparent !important; font-size: 12px !important; font-weight: normal !important; cursor: pointer; }
    : c3 Y5 o& F4 |+ q$ |
19. 
    
20. /*-----------------------------------------------------------------------------------表单通用样式*/
    
21. 
    
22. form { margin: 0; }
    1 ^7 i! f9 S) R
23.         input, textarea, button, select { font: 1em Arial, Helvetica, sans-serif; }
    : u0 r; A" B8 P) ~
24.         button { height: 1.8em; padding: 0 0.3em; background: #9FC8DF; cursor: pointer; border: 1px solid;
    # c+ i( U. Y2 B: v0 I( K
25.                 border-top-color: #C9E3F0; border-right-color: #2A8ABA; border-bottom-color: #2A8ABA; border-left-color: #C9E3F0; }
    
26.         fieldset { border: 0; padding: 0; }
    
27.                 legend { display: none; }
    
28.         label { cursor: pointer; margin-right: 0.5em; }
    
29. 
    $ s$ L* d# b2 Y' i; r% X) l
30. /*-----------------------------------------------------------------------------------头部风格 Header*/
    9 v2 U# U- @9 u4 g: `/ m
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; }
      t3 ~+ U. O3 Z& ~0 o  t/ {7 Q
33.         #topmenu ul { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid #86B9D6; }
    . }( s( \, @) s& n
34.                 #topmenu li { display: inline; border-left: 1px solid #86B9D6; padding-left: 1em; padding-right: 0.5em; }
    
35.                         #topmenu a { color: #154BA0; }
    
36. 
    
37. #pagetitle { padding: 8px 0; height: 76px; he\ight: 60px; border-bottom: 4px solid #F5FBFF; }
    % [1 |+ O8 V9 F. \( Y; p
38.         #logo { border-right: 1px solid #86B9D6; padding: 0 10px; margin-right: 10px; }
    
39.         .banner468 { float: right; }
    
40. 
    # k( L2 \% p1 z( e6 Z7 G+ L7 b+ P
41. /*主导航*/
    " F8 V- ~& {4 u
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; }
    ) |: k, [9 Y8 l9 K
45.         /*首页导航*/
    
46.         #menu dl { margin: 0 1.5em; padding: 0; height: 25px; overflow: hidden; }
    
47.                 #menu dt { float: left; width: 4em; white-space: nowrap; }
    
48.                         #menu dt a { color: #000098 !important; }
    9 i- Y4 x1 C- h; k
49.                 #menu dd { float: left; width: 6em; margin: 0 2px; overflow: hidden; white-space: nowrap; }
    $ m- l; V. u6 I& l. w- i5 B
50. 
    ) n+ m, C4 I5 r
51. /*您的位置导航*/
    . P  B/ w( [; u4 M. a
52. #navigation { padding: 1.2em 0; }
    * }- l+ Z" m& i/ I2 J3 Z. P
53.         #navigation p { margin: 0;}
    
54.                 #navigation p a, #navigation p strong { margin: 0 0.5em; }
    
55.         #searchform { float: right; }
    
56.                 #searchform * { vertical-align: top; }
    0 [) c7 z& t8 e8 l: P# w
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; }
    
61.                 .simplepage h2 { margin: 0; font-size: 1.2em; padding-left: 0.5em; }
    
62. 
    * ^: P4 R6 [5 B/ U. B
63. /*-----------------------------------------------------------------------------------布局*/
    9 b$ V; P' d  ], H& p% Q" U
64. 
    
65. .content { /*三列布局*/
    
66.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y 0 0; }
    ' K5 O( ~3 e8 t; k- t: n7 E7 _
67.         /*\*/ * html .content { height: 1%; } /**/ *>.content { overflow: hidden; }
    + D. c, C6 s: O( O- m  m3 c
68. .contentL { /*两列布局，侧边在左侧*/
    * j! ~1 K' @/ u8 A( E; B2 j
69.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y -590px 0; }
    
70.         /*\*/ * html .contentR { height: 1%; } /**/ *>.contentR { overflow: hidden; }
    
71. .contentR { /*两列布局，侧边在右侧*/
    & |( _9 u! u- B* ]6 Z
72.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y 580px 0; }
    , g4 G! y9 Y* M  t: P  p
73.         /*\*/ * html .contentR { height: 1%; } /**/ *>.contentR { overflow: hidden; }
    
74. /*侧边样式*/
    
75. .sideL { width: 296px; float: left; overflow: hidden; }
    
76. .sideR { width: 202px; float: right; overflow: hidden; }
    7 |. f2 F1 `' {$ `, H4 t: h
77. /*中间部分样式*/
    " n: ~" F  F' B8 U9 [
78. .mainarea { margin: 0 4px; width: 382px; float: left; }
    4 X1 H3 i  [) m. }+ p* ^' e
79.         .contentL .mainarea { margin: 0 0 0 4px; width: 556px; }
    
80.         .contentR .mainarea { margin: 0 4px 0 0; width: 576px; }
    - _5 S4 w" g  K0 q3 I  Q+ i9 H
81. 
    
82. /*-----------------------------------------------------------------------------------版块样式*/
    % D' s  Q" d1 M9 G$ {1 @
83. 
    3 v/ n4 W( C1 Y! |
84. /*版块标题*/
    ( A. X# R' E( W+ q/ L8 `/ Z) s' o
85. .blocktitle { clear: both; border: 1px solid #86B9D6; padding: 1px; margin-bottom: 4px; line-height: 30px; }
    
86.         .blocktitle h2 { font-size: 1.2em; margin: 0; padding: 0 5px; background: #9FC8DF url(../images/new/title_bg.gif) repeat-x; }
    
87.         .blocktitle .more { margin-right: 5px; }
    
88. 
    
89. /*头条信息*/
    # S0 }5 N6 t' Q& ]! d
90. #headline { padding: 5px; height: 70px; he\ight: 58px; overflow: hidden; }
    # W: B! o  ~7 u7 }# z6 U
91.         #headline strong { font-size: 1.2em; }
    # m. ^3 V% j; f! V0 ]8 i+ U& y
92.         #headline p { margin: 0.3em 0; }
    " q9 }  h! o: B6 ^1 y9 ]/ d4 {0 E
93.         #headline img { float: right; width: 48px; height: 48px; border: 4px solid #FFF; }
    
94. 
    5 }! V( R) U: o$ b- b3 D$ |
95. /*侧边版块*/
    
96. .sideblock { margin: 0 0 3px; border: 1px solid #86B9D6; background: #FFF; padding: 3px; }
    
97.         .boldblock { padding: 1px; background: #9FC8DF; } /*突出版块*/
    7 ^) N: q* }& S2 j' }& F
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; }
    - e2 p" |  }3 l6 W5 Z: O3 x
100.                         /*\*/ * html .sideblock h3 { height: 1%; } /**/
     
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; }
     7 r4 u, |% y1 t+ @
103. 
     
104.         /*侧边多行列表*/
     ) r6 p4 W6 J, h! C$ w/ P, j9 d7 t
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; }
     5 o% x) x0 d- a8 [
108.                 .sideblock dd { color: #999; margin-left: 0.8em; }
     + ]5 Q6 [+ r0 J* \5 h
109.                         .sideblock dd a { color: #999; }
     
110. 
     . a' k) P: L- {
111. /*单行信息列表*/
     
112. .msgtitlelist { margin: 0; padding: 5px 0; list-style: none; line-height: 1.6em; }
     ! @  [9 x5 C3 ]! v: 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; }
     
114.         .mainarea .msgtitlelist { font-size: 1.2em; }
     
115.         .sideblock .msgtitlelist { background: #FFF; }
     3 E7 k! z7 j5 w. c1 A" g5 D  @% \
116. 
     # e" `% ^7 k, h( [5 n
117. /*多行信息列表*/
     
118. .messagelist { margin: 5px 0; padding: 0; list-style: none; line-height: 1.6em; }
     . l- w- s' ^7 l/ Q! p
119.         .messagelist li { margin: 5px 0 10px 0;}
     5 h0 H: ], z; F( y" d
120.                 .messagelist li h4 { margin: 5px 0; font-size: 1em; line-height: 2em; background: #F0F9FF; }
     
121.                         .messagelist li h4 a { color: #009; font-size: 1.2em; }
     ( @+ k. P- o+ e* D% }% T8 F/ y
122.                                 .messagelist li h4 a:visited { font-weight: normal; }
     $ ^/ d$ t: l0 Q7 Y
123.                 .messagelist li p { margin: 0; }
     # k8 q9 y0 y4 m# D8 }. [
124. 
     
125.         .messagelist dl { margin: 0; padding: 0; line-height: 1.6em; }
     
126.                 .messagelist dt { background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.7em; padding-left: 0.8em; }
     $ h6 r9 c9 S9 F& F( x0 t
127.                 .messagelist dd { font-size: 12px; margin: 0; padding-left: 1em; color: #999; }
     9 P. j$ A% M; p# n! @+ N! `
128.                         .messagelist dd a { color: #999; }
     
129. 
     / d, D, C6 Z7 {1 l/ K/ Y
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; }
     0 y! \- s! X( {# j0 l6 B! ^
134.                 #hottag a { margin-right: 0.2em; white-space: nowrap; }
     
135.                         #hottag a em { color: #999; font-style: normal; }
     
136. 
     8 y! D8 x8 X  y
137. /*用户面板*/
     - r6 Y% p! k! @3 u: Z
138. #userpanel { height: 8.8em; overflow: hidden; }
     
139.         #userpanel form { margin: 5px auto !important; margin: 0 auto; width: 150px; }
     % c$ l/ u- r( t( x
140.                 #userpanel input { width: 90px; }
     
141.                 #userpanel p { margin: 0.5em 0; }
     
142.                 #dologin { float: right; }
     
143.                 #userpanel form a { line-height: 2em; color: #B353B3; border-right: 1px solid #86B9D6; padding-right: 5px; }
     
144.         /*登录后*/
     : t, ^( d4 i/ C# q: r. @5 m3 H+ p
145.         #userpanel li { border-bottom: 1px solid #BBE9FF; background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.8em; padding-left: 12px; }
     + M2 Y  l/ [) @' h
146.                 #userpanel li a { color: #000098; }
     4 D. s, d0 O% _% @3 B3 u5 x% l
147. 
     
148. /*空间之星*/
     $ {  D7 i+ u) U1 k6 W
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; }
     3 A; n$ \0 k$ L- P1 W3 p
151.         #spacestar img { width: 48px; height: 48px; margin-top: 3px; }
     ! L. j+ G! A$ n: s8 |  O
152.         #spacestar p { margin: -4px 0 !important; margin: 0 0; line-height: 20px; height: 20px; }
     
153. 
     
154. /*同城空间*/
     
155. #cityspace { background: #F0F9FF; }
     
156. #cityspace form { width: 10.5em; margin: 0 auto; padding: 5px 0; }
     
157.         #cityspace select { margin: 2px 0; }
     
158.         #cityspace button { float: right; margin-top: 4px; width: 3.5em; height: 3.5em; }
     9 D5 j, x% x1 y5 E# P
159.         #blogblock #cityspace { margin: 0 0 4px 0; }
     & N. x! i" v' O* V
160. 
     
161. /*空间排行*/
     7 A2 M" c) U# N+ Z) g; `: v
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; }
     % A" f9 K9 Q# l% S$ u/ C8 J* q2 X
163.         #hotspace li { height: 20px; overflow: hidden; }
     
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; }
     ' K0 ]5 y9 R/ o+ Q5 ^/ B2 Z
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; }
     : G9 H+ e0 a  C; F
171.                         #hotarticletabs span.active { background: #FFF; color: #333; border: 1px solid #86B9D6; border-bottom: none; }
     / c2 ?2 y' W" H
172.         #hotarticle ul { background: #FFF; margin: 0; padding: 0.5em; list-style: none; line-height: 1.7em; height: 16.5em; overflow: hidden; }
     5 Q9 A0 R, H1 S
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. 
     
175. /*图片列表*/
     
176. .imgthumblist { margin: 0 3px; padding: 0; list-style: none; }
     
177.         /*\*/ * html .imgthumblist { height: 1%; }/**/ *>.imgthumblist { overflow: hidden; }
     & n& h6 J8 J. X5 [* c% ?- j7 o+ y# x
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; }
     6 \  c2 T7 ^, ]3 e" Z; s. q! K
179.                         .imgthumblist li.list1line { height: 123px; height: 115px; }
     
180.                         .imgthumblist li.list2line { height: 143px; height: 135px; }
     ' o0 v0 `/ t3 K& i& P* N! v4 [/ O
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 n3 C9 L0 Y/ Z5 {9 i. w! c
184.         .throughgallery { width: 100%; clear: both; margin-bottom: 5px; padding-bottom: 3px; background: #E2F0F9; }
     7 ]0 e2 T( \7 M% t
185.                 .throughgallery .imgthumblist { margin: 0; }
     & r7 k* u% Y! U- }5 p
186.                 .throughgallery .imgthumblist li { height: 120px; margin: 3px 1px; }
     
187. 
     
188. /*商品*/
     
189. /*\*/ * html .goodsthumblist { height: 1%; } /**/ *>.goodsthumblist { overflow: hidden; }
     8 b8 }5 y' Y" R! A0 S3 z
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; }
     
194. 
     
195. .imgtitlelist { margin: 10px 0; padding: 0; list-style: none; }
     ( A" B3 Q, e2 M) b
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; }
     
198.                         .imgtitlelist li h4 { margin: 0.3em 0; font-size: 1em; }
     
199.                         .imgtitlelist li img { float: left; margin-left: -85px; width: 70px; height: 70px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED; }
     2 V0 o/ z+ c6 X
200.                         .imgtitlelist li p { margin: 0; line-height: 1.5em; }
     * w3 r6 P6 v9 D/ k4 O2 K& q- l- _& M
201.         .sideblock .imgtitlelist li { padding-left: 65px; }
     2 w* z! u) o* `# a
202.                 .sideblock .imgtitlelist li img { width: 48px; height: 48px; margin-left: -60px; }
     
203.        
     , K' p; O$ H+ x0 \
204. 
     7 r4 ^, k# I0 k" R
205. /*栏目区块列表*/
     
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; }
     % a& v" ^0 A' P( Q& ~
208.                 .category h3 strong { background: #E9ECEF; float: left; padding: 0 8px; }
     5 R, U2 \; f0 T. x
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; }
     
211.                 .category li { padding-left: 0.8em; background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.7em; }
     * g7 }' U9 G/ |& v
212.         .catecommend { background: #F0F9FF; margin: 0; line-height: 2em; height: 2em; overflow: hidden; padding: 0 1em; }*/
     8 `9 X4 B% }- m( S6 }# u
213.                 .catecommend a { color: #000099; white-space: nowrap; margin-right: 0.5em; }
     9 \2 @5 Q5 b% R+ D( ~$ `5 i
214. 
     
215. 
     
216. /*-----------------------------------------------------------------------------------首页各版块*/
     / a) R1 s! Z; d" R6 N* @8 L4 a
217. 
     : l0 {/ `; m0 k3 K9 Z( A$ ?3 I6 c
218. /*#commendimage { height: 155px; }
     , ?" _5 o: c% o0 Y1 I
219. #topicnews { height: 217px; }
     
220. #newgoods, #commendgoods { height: 200px; }
     
221. #hotcommentfile, #hotfile, #newlink, #hotlink { height: 220px; }*/
     
222. 
     
223. 
     ) o- C8 s1 A1 x' W
224. 
     
225. 
     : i+ f( ^! p( G# c! W4 @
226. /*信息列表*/
     # S0 k1 L. s9 j/ \: d
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; }
     
229. /*.articlelist  h3 a { font-size: 12px; font-weight: normal; margin-left: 1em; color: #B353B3; }
     ) W$ m0 c: M) H3 k" ~
230.        
     8 B, y6 F; M7 h4 u6 X) V
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; }
     
234.                 .articlelist h4 em { font-style: normal; font-weight: normal; font-size: 0.8em; color: #B353B3; margin-left: 0.3em; }
     7 Q, t8 r  L( U% w' L0 b7 a2 H
235.                 .articlelist h4 a { color: #000099; }
     ) m: r$ z' t7 Y+ o
236.                 .articlelist li img { position: absolute; left: 0!important; left: -67px; top: 0; border: 3px solid #9FC8DF; width: 48px; height: 48px; }
     ' m" I- @, \+ B
237.                
     6 c  k5 U0 P4 m' ~: Z7 H
238.                 .articlelist li strong { font-weight: normal; color: #999; line-height: 2em; padding-left: 0.5em; }
     & a! A* z& W* a" D
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; }*/
     9 n+ I! B+ M4 z. x
242. 
     
243. 
     ; p% Y- k3 v  t- N4 c, _
244. .catepic { text-align: center; }
     
245.         .catepic img { margin-top: 10px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED;
     , a1 ]* \. ?% R+ i7 c4 i* _
246.                 max-width: 150px; max-height: 150px; width: expression(this.width > 150 ? 150: true); height: expression(this.height > 150 ? 150: true); }
     9 Y$ X! d  f- V3 O! u4 h( H
247.         .catepic p { text-align: left; margin: 0.5em; }
     6 R3 S( C. A* |0 l
248. 
     1 N1 s5 @6 W$ k* `- z5 _  e
249. /*专题列表*/
     
250. #subjectlist { border-color: #86B9D6; padding: 2px; }
     % f5 N+ v( z7 Y7 n$ x3 C
251.         #subjectlist h3 { border: none; background: #9FC8DF; }
     , E4 ~3 X/ g+ q
252.         #subjectlist li { border-bottom: 1px solid #E2F0F9; text-align: center; padding: 3px; }
     
253.                 #subjectlist p { margin: 0; line-height: 1.2em; }
     " |; E  K% \8 j# U1 f& y) G
254. 
     4 D9 g8 j, V8 V
255. 
     0 q$ V$ J. H" @0 P
256.         #xspace-rates { height: 2em; }
     
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; }
     
261. 
     
262. 
     
263. #panel { width: 600px; overflow: hidden; margin: 1em auto; }
       n+ G/ l8 y, w+ K3 n: N2 J- A
264. 
     " C, G( U$ s; R. x" l5 @
265. 
     6 l# ]  }9 I4 m& S8 O
266. /*Pages*/
     % K7 |1 r9 M) l
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. 
     4 U3 b# Y  }. P) N7 }) [- A
273. /* 分页 */
       J3 [2 J; k1 t
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; }
     
276.                 table.xspace-page a:hover { background: #86B9D6; }
     
277.         table.xspace-page td.xspace-current { background: #86B9D6; padding: 0.3em 0.5em; font-weight: bold; }
     
278.         table.xspace-page td.xspace-totlerecord, .xspace-page td.xspace-totlepages { background: #E2F0F9; padding: 0.3em 0.5em; }
     
279. 
     % x* O9 y8 J0 k) P/ ~; P0 Y
280. .smalltxt { font-size: 12px; color: #999; font-weight: normal; }
     
281.         .smalltxt a, .smalltxt a:visited { color: #999 !important; }
     1 g4 X- d, V2 ^4 u4 S
282. 
     - I' X4 [) f/ x" s8 d. Z% i
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; }
     ; O, U- T* K% o: B  |
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; }
     1 a, l+ r: J7 l
288.        
     . U0 C- y. V' C2 A4 K; ]
289. .imglogolist { margin: 0; padding: 0; list-style: none; text-align: center; }
     
290.        
     + f& X& l( u+ m; H
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;}
     % M7 X, ?+ i, x# E
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; }
     - F/ a- p- A; o9 k1 j; d7 ~
297.         #articlebody * { line-height: normal; }
     
298.                 #articlebody  p, #articlebody  div { line-height: 1.8em !important; margin: 10px 0; }
     - }; J. g" q. I( Y7 M
299.                         #articlebody  p *, #articlebody  div * { line-height: normal !important; }
     " w% b9 H. A% ^2 X
300.        
     
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; }
       s* _# W; a1 T" G" w; q* b" K
303.                 #articlebody .addoninfo ul { margin: 0.5em 0 0.5em 2em; padding: 0; }
     
304.                         #articlebody .addoninfo li { line-height: 1.6em !important; }
     . n5 g7 [5 R. ?: L8 u# c. `# Y8 o
305.        
     ( o0 _! K( Z' O! G+ h+ `; s% I: N
306.         #articlebody img { width: expression(this.width > 500 ? 500: true); max-width: 500px;  }
     
307.        
     $ _3 S+ N) v  k) H3 x+ G3 b2 R: o4 [, h
308.         #articlebody kbd.showvideo, #articlebody kbd.showflash { font: 1em Arial, Helvetica, sans-serif; cursor: pointer; text-decoration: underline; }
     9 ^- Y4 u/ R8 R' D5 |# o& O' }- p
309.         #commentlist { overflow: hidden; border: 1px solid #86B9D6; margin: 4px 0 0; padding: 0 5px; }
     
310.                 #commentlist h3 { font-size: 1em; line-height: 2em; margin: 0; background: #F0F9FF; border-bottom: 1px solid #86B9D6; }
     ' O, ^6 [  D" ?! O8 v+ e
311.                                 #commentlist img { max-width: 500px; width: expression(this.width > 500 ? 500: true); }
     
312.                         #commentlist .messagelist li div { width: 98%; margin: 0 auto; overflow: hidden; text-align: left; overflow-y: hidden; line-height: 1.8em; }
     
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; }
     , F8 y, L6 @8 ~
315.                                                 #commentlist .messagelist li div  p *, #commentlist .messagelist li div  div * { line-height: normal !important; }
     
316. 
     
317. /*发表评论*/
     & o% b4 ?, A6 e/ n8 F
318. #comment { margin-top: 4px; }
     / e5 `3 l2 f" R0 N* `& ~
319.         #comment h3 { margin: 0 5px; font-size: 1em; line-height: 2em; }
     2 s* d( x4 b2 h& L+ g
320.         #comment form { background: #FFF; margin: 0; padding: 5px; }
     9 L8 u9 Z- g/ q8 h6 f7 F7 S" z" n( J0 @
321.         #comment p { margin: 0.3em 0; }
     
322.         .seccodeline * { vertical-align: middle; }
     7 t2 D: x; |' k8 p7 j5 q
323.         #xspace-rates { height: 2em; }
     1 e& M- C. H- g  j4 e
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; }
     / |: v; y* z! W2 q; m( h) e
326.                         #xspace-rates a:hover { border-color: #CCC; }
     % H8 C2 s$ b' n" f* h
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; }
     7 E; u+ n- [0 s) M, x
328. 
     8 Y: I/ w" ^# L8 f
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; }
     1 ^: b  r' A, c$ R/ Z# z# v
332.                 .xspace-ajaxdiv h5 a { float: right; font-weight: normal; }
     ; ?& [2 |+ L+ M+ b
333.         .xspace-ajaxcontent { background: #FFF; border: 1px solid #EEE; }
     
334.                 .xspace-ajaxcontent form { margin: 0; }

复制代码

傲天♂浪子追风

1. /*-----------------------------------------------------------------------------------综合设置*/
   ; _0 r* m. m7 m  g3 }7 p5 B3 r
2. 
   % Y$ f5 R. u6 J0 o6 D
3. body { margin: 0; background: #FFF; color: #333; text-align: center; font: 12px Arial, Helvetica, sans-serif; }
   ' i. N# z* x4 I8 A! Y# X% o1 L( t# u
4. #wrap { background: #FFF; margin: 0 auto; text-align: left; width: 910px; padding: 0 4px; w\idth: 910px; }
   
5. 
   8 e$ ]  Q/ w5 c0 T' g$ X- n" n2 {% J9 ?

复制代码

# J; }1 Y& X1 M6 Q) m2 h' i分析

9 z" v- ]2 f* b/ r2 z! |

1. margin属性说明：
   0 _+ r8 b6 O/ f( J' x
2. 
   5 }* e& }* x7 {' p9 A7 j  j8 Z0 i
3. 检索或设置对象四边的外延边距。
   , h2 f1 E9 s6 A6 T8 x0 o# P! q
4. 如果提供全部四个参数值，将按上－右－下－左的顺序作用于四边。
   ' m5 y& B4 B/ W
5. 如果只提供一个，将用于全部的四边。
   
6. 如果提供两个，第一个用于上－下，第二个用于左－右。
   1 e! D+ j8 L; i( ]/ D, B! K- `7 h
7. 如果提供三个，第一个用于上，第二个用于左－右，第三个用于下。
   
8. 内联对象要使用该属性，必须先设定对象的height或width属性，或者设定position属性为absolute。
   
9. 在IE4+，margin属性不可用于td和tr对象。
   
10. 外延边距始终透明。
    8 O$ |8 d) g. R0 @# M* d
11. 
    6 q/ O1 `0 P% \9 @+ _5 o
12. color : 　指定颜色
    
13. text-align:文本的对齐方式。(left : 　左对齐,right : 　右对齐,center : 　居中,justify : 　两端对齐)
    ! L0 R; X6 r8 i& o' e0 S
14. font: 12px Arial, Helvetica, sans-serif;  :这段是字体相关的
    ! A% q6 l6 ]/ }. a# H" S: p
15. 
    
16. 
    9 C4 s9 p9 W" X& K

复制代码

傲天♂浪子追风

1. /*链接样式*/
   " `8 b; f- |- q& J, ?
2. a { color: #000; text-decoration: none; }
   ; _/ O7 I" i% s5 T; Z
3.         a:hover { text-decoration: underline; color: #000098; }
   2 r! R* G( i4 ?+ j" z6 s6 R* e+ v
4.                 a:visited { color: #666;}
   * ]( v7 v9 u4 l, J( f% p
5.         #topmenu a, #menu a, .imglist a, #hotspace li a { text-decoration: none; }
   $ o1 ^' m% G& r6 l
6.                 #topmenu a:hover, #menu a:hover, .imglist a:hover, #hotspace li a:hover { text-decoration: underline; }
   
7.         a img { border: none; }
   
8. li cite { font-style: normal; font-size: 12px; float: right; width: 4em; color: #999; }
   
9.         li cite a { color: #999; }
   4 U2 ^' v% x6 p0 E( ]0 }- n
10.                 li cite a:visited { color: #999; }
    # t+ _  g* Y  k3 g
11. .more { float: right !important; color: #000098 !important; background: transparent !important; font-size: 12px !important; font-weight: normal !important; cursor: pointer; }
    
12. 
    2 y5 _7 ^1 T5 v: J$ s

复制代码

' N5 `* I( q7 k+ a& L
% V) {- J* ~2 ?4 r分析

1. 
   ' _& M6 z. C& V; r. A) e  g# J/ h1 k
2. text-decoration:文本连接的属性,一般有以下几种参数:
   
3. none : 　无装饰
   6 O5 p2 Z" B9 P* Z
4. blink : 　闪烁
   
5. underline : 　下划线
   
6. line-through : 　贯穿线
   
7. overline : 　上划线
   2 \8 n9 G: }4 K- D8 C* o
8. 
   
9. 
   3 n& h9 x+ D; A8 p7 x
10. hover:设置对象在其鼠标悬停时的样式表属性。
    
11. 
    ; N  H$ E! r8 ?* L$ o  m- K" V
12. visited:对象在其链接地址已被访问过时的样式表属性。
    
13. 
    
14. #topmenu a, #menu a, .imglist a, #hotspace li a { text-decoration: none; }
    + q0 p7 ^) ]1 j' Q
15. #topmenu a:hover, #menu a:hover, .imglist a:hover, #hotspace li a:hover { text-decoration: underline; }:
      W" M  j5 D2 m& ?
16. 上面这两行是与鼠标相关
    
17. 
    ' G) M6 H! w6 z5 D, ^9 T; d
18. a img { border: none; }图片连接相关
    
19. 
    
20. 
    
21. cite:这个一般是引用标签的时候用的,不知道用来这里做什么
    ! Q" E/ A( Z2 ]0 S/ U
22. 
    
23. 
    
24. font-style:字体式样,一般常用参数有:
    1 n3 x$ W: h7 W* f/ t( ?
25. normal : 正常的字体
    
26. italic : 斜体。对于没有斜体变量的特殊字体，将应用oblique
    
27. oblique : 倾斜的字体
    ! D' {/ R% D$ K7 j2 j
28. 
    ) E9 U' t5 p4 @; r/ _
29. 
    & j: o8 B* L. ~  L
30. float: right 该属性的值指出了对象是否浮动及如何浮动。常用参数如下:
    
31. none : 　对象不浮动
    ' H( |# q0 W6 D& q; l: @
32. left : 　对象浮在左边
    * f: ^0 M# U' J0 H  \
33. right : 　对象浮在右边
    
34. 
    0 s6 e: x( T* V6 c. }
35. 
    4 f* B4 E7 Y: `6 b) b
36. important:样式表条目,提升指定样式规则的应用优先权。
    
37. 
    9 h* I  V+ P# k
38. 
    
39. background: transparent 这个的意思就是背景透明...
    
40. 
    
41. 
    
42. 
    ( n: x1 U) b7 ^5 D3 e
43. font-weight: normal :文本字体的粗细,常用参数如下:
    6 f! N& w4 G  i5 e2 j5 X
44. normal : 正常的字体。相当于number为400。声明此值将取消之前任何设置
    4 g' Y3 O7 n; u# g$ N: Z
45. bold : 粗体。相当于number为700。也相当于b对象的作用
    7 a9 ?; \3 a, C9 Q9 q# {
46. bolder : IE5+　特粗体
    - E& C: O8 }2 D8 r
47. lighter : IE5+　细体
    
48. number : IE5+　100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
    
49. 
    
50. cursor: pointer:这个是鼠标放在对象中的状态,简单点来可以这样说,也就是鼠标放在连接上的时候显示的鼠标形状,一般有以下N种参数,这个真的是TMD的多啊
    
51. 语法：(每一竖隔开为一个状态)
    , e' J# t" i+ \, ?8 X
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. 
    7 \1 n% _1 B# h( E
54. 
    
55. 
    
56. 
    
57. 
    , K9 C6 V0 D; m2 Q9 \$ T
58. 
    / Z" N9 a. f  R7 D) a
59. 
    

复制代码

傲天♂浪子追风

1. /*-----------------------------------------------------------------------------------表单通用样式*/
   
2. 
   
3. form { margin: 0; }
   
4.         input, textarea, button, select { font: 1em Arial, Helvetica, sans-serif; }
     D5 h0 V, [4 s8 D; Q0 }
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; }
   3 x+ U  ?$ u, k1 }' u
7.         fieldset { border: 0; padding: 0; }
   ( V: I  K$ E& k
8.                 legend { display: none; }
   
9.         label { cursor: pointer; margin-right: 0.5em; }
   & o! u2 D3 F6 P4 F% z

复制代码

bronwen

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

傲天♂浪子追风

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

傲天♂疯紫

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