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

傲天♂浪子追风

1. * { word-break: break-all; } /*在IE中实行强制换行*/
   
2. #newsblock { margin-top: 4px; }
   
3. /*-----------------------------------------------------------------------------------综合设置*/
   
4. 
   , c) O# L4 u, _! b+ j1 B' p* g( z
5. body { margin: 0; background: #FFF; color: #333; text-align: center; font: 12px Arial, Helvetica, sans-serif; }
   2 p/ ~! j+ f" y9 j: U! K' e7 n
6. #wrap { background: #FFF; margin: 0 auto; text-align: left; width: 910px; padding: 0 4px; w\idth: 910px; }
   " A6 s' h' \+ j" J, C& v( _
7. 
   
8. /*链接样式*/
   $ C& {  C* z0 o
9. a { color: #000; text-decoration: none; }
   # j3 I1 d( F8 ]4 a
10.         a:hover { text-decoration: underline; color: #000098; }
    % v# A! C/ l9 k4 Q" H, o8 |% z0 i
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; }
    , ?% ~  |0 Y; G+ |' O& `+ E
14.         a img { border: none; }
    
15. li cite { font-style: normal; font-size: 12px; float: right; width: 4em; color: #999; }
    0 O2 B2 s3 i/ p- b5 P  e
16.         li cite a { color: #999; }
    
17.                 li cite a:visited { color: #999; }
    , {* G3 K; I& n+ Q7 O
18. .more { float: right !important; color: #000098 !important; background: transparent !important; font-size: 12px !important; font-weight: normal !important; cursor: pointer; }
      y3 b/ C% }( I# R
19. 
    0 m" [" R' p! W
20. /*-----------------------------------------------------------------------------------表单通用样式*/
    
21. 
    7 Q' p8 {8 U* Q' k  J2 T
22. form { margin: 0; }
    
23.         input, textarea, button, select { font: 1em Arial, Helvetica, sans-serif; }
    
24.         button { height: 1.8em; padding: 0 0.3em; background: #9FC8DF; cursor: pointer; border: 1px solid;
    
25.                 border-top-color: #C9E3F0; border-right-color: #2A8ABA; border-bottom-color: #2A8ABA; border-left-color: #C9E3F0; }
    
26.         fieldset { border: 0; padding: 0; }
    
27.                 legend { display: none; }
    - k: {5 s8 }/ S9 r& ~# g5 Q
28.         label { cursor: pointer; margin-right: 0.5em; }
    $ H/ C) }! Q8 \% g  D/ {# y
29. 
    ; P7 I& u$ K! a& L9 b
30. /*-----------------------------------------------------------------------------------头部风格 Header*/
    ( T( _" O8 P0 Z# h8 k; p9 {
31. /*顶部导航*/
    7 b% h$ Q0 D- G8 e6 H/ }
32. #topmenu { background: #9FC8DF url(../images/new/title_bg.gif) repeat-x 0 -3px; border-bottom: 4px solid #F5FBFF; border-top: none; text-align: right; line-height: 2em; }
    
33.         #topmenu ul { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid #86B9D6; }
    
34.                 #topmenu li { display: inline; border-left: 1px solid #86B9D6; padding-left: 1em; padding-right: 0.5em; }
    
35.                         #topmenu a { color: #154BA0; }
    * r& Z: T7 z" H; y4 T# [' I
36. 
    
37. #pagetitle { padding: 8px 0; height: 76px; he\ight: 60px; border-bottom: 4px solid #F5FBFF; }
      q( t5 [- P# f3 S
38.         #logo { border-right: 1px solid #86B9D6; padding: 0 10px; margin-right: 10px; }
    
39.         .banner468 { float: right; }
    3 t0 ~- d2 k' n4 G/ U/ H
40. 
    - y6 X+ Q* U7 Y. f. P
41. /*主导航*/
    * U7 p; p. E+ x: k( d! \- b
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; }
    8 b2 n) j" e, [- _. J& h2 |) n
43.         #menu ul { list-style: none; margin: 0 1em; padding: 0; width: 100%; overflow: hidden; }
    - W7 b% J& S4 i. V' ?
44.                 #menu li { float: left; margin: 0 2px; width: 6em; overflow: hidden; white-space: nowrap; }
    
45.         /*首页导航*/
    ( X) [$ o! s4 v6 a  d, V
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; }
    ' c9 E2 m, z4 o, j6 D3 u* t
49.                 #menu dd { float: left; width: 6em; margin: 0 2px; overflow: hidden; white-space: nowrap; }
    
50. 
    
51. /*您的位置导航*/
      U& C. o5 U2 S, z1 y- N0 F$ Q
52. #navigation { padding: 1.2em 0; }
    
53.         #navigation p { margin: 0;}
    1 Z( K& |$ w" h5 N, h& e
54.                 #navigation p a, #navigation p strong { margin: 0 0.5em; }
    
55.         #searchform { float: right; }
    ; i- w0 S+ x5 h5 z, |
56.                 #searchform * { vertical-align: top; }
    4 k" z- E$ `& _. @4 `' o8 w  C
57.                 #searchform button { margin-left: 0.5em; }
    1 c+ z3 k5 M- R' m, O7 U" O9 |
58. 
    , k7 o. q8 x3 o" L% T
59.         #navigation.simplepage { padding: 0; border-top: 2px solid #009DEA; border-bottom: 1px solid #009DEA; line-height: 25px; background: #EFF5FF; margin-bottom: 1em; }
    6 Z3 k3 Q( ^2 R4 x
60.                 #navigation.simplepage p { float: right; margin-right: 0.5em; }
    ! o2 E# |7 Q* x' C
61.                 .simplepage h2 { margin: 0; font-size: 1.2em; padding-left: 0.5em; }
    
62. 
    / C7 Z' Z7 X& i, Z" k& {
63. /*-----------------------------------------------------------------------------------布局*/
    3 R7 U" z' d+ S  p
64. 
    
65. .content { /*三列布局*/
    5 r' c! f' C3 i) ^5 m
66.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y 0 0; }
    1 d8 W  s  A/ B/ h1 P- w6 @
67.         /*\*/ * html .content { height: 1%; } /**/ *>.content { overflow: hidden; }
    
68. .contentL { /*两列布局，侧边在左侧*/
    
69.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y -590px 0; }
    , z- D1 x; g% M: j- {
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; }
    ( S4 M% z* [) v2 A/ A. f
74. /*侧边样式*/
    0 ^; o; q7 q* O0 k6 {
75. .sideL { width: 296px; float: left; overflow: hidden; }
    
76. .sideR { width: 202px; float: right; overflow: hidden; }
    ( q* I% H: N8 O' Y
77. /*中间部分样式*/
    " {6 @& P, W0 F) O6 Z* H
78. .mainarea { margin: 0 4px; width: 382px; float: left; }
    5 L/ w/ A6 N8 l4 p
79.         .contentL .mainarea { margin: 0 0 0 4px; width: 556px; }
    1 w4 l, @% `/ h; Q2 _: D
80.         .contentR .mainarea { margin: 0 4px 0 0; width: 576px; }
    
81. 
    
82. /*-----------------------------------------------------------------------------------版块样式*/
    ; H9 U) m9 q' g3 u8 x
83. 
    
84. /*版块标题*/
    
85. .blocktitle { clear: both; border: 1px solid #86B9D6; padding: 1px; margin-bottom: 4px; line-height: 30px; }
    
86.         .blocktitle h2 { font-size: 1.2em; margin: 0; padding: 0 5px; background: #9FC8DF url(../images/new/title_bg.gif) repeat-x; }
    
87.         .blocktitle .more { margin-right: 5px; }
    " U8 c5 H/ m, d% W5 `! H( B: H
88. 
    ( q" h5 z2 [3 j! E5 X* M! g$ Q
89. /*头条信息*/
    
90. #headline { padding: 5px; height: 70px; he\ight: 58px; overflow: hidden; }
    ; W6 M$ A3 ?- R* M
91.         #headline strong { font-size: 1.2em; }
    1 f* \+ h- k: d, u( J
92.         #headline p { margin: 0.3em 0; }
    2 t& F+ o2 H9 E# ]
93.         #headline img { float: right; width: 48px; height: 48px; border: 4px solid #FFF; }
    
94. 
    
95. /*侧边版块*/
    
96. .sideblock { margin: 0 0 3px; border: 1px solid #86B9D6; background: #FFF; padding: 3px; }
    6 W% Z5 U+ K; y+ I) D; `( p0 P; B
97.         .boldblock { padding: 1px; background: #9FC8DF; } /*突出版块*/
    
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; }
    " i, N3 i) b5 q, q8 \
100.                         /*\*/ * html .sideblock h3 { height: 1%; } /**/
     
101.                 .sideblock p { margin: 0.3em; line-height: 1.6em; }
     ; v1 _/ @' i6 P! S$ _8 a
102.                         .headimg { float: right; margin: 5px 0 2px 5px; width: 80px; height: 80px; border: 4px solid #E2F0F9; }
     0 H! g* J( P0 A3 a* n3 e9 m* g2 Y
103. 
     
104.         /*侧边多行列表*/
     
105.         .sideblock dl { margin: 0; padding: 5px; background: #FFF; line-height: 1.8em; }
     1 J+ X' z) O9 u  c0 ]2 P% `
106.                 /*\*/ * html .sideblock dl { position: relative; } /**/
     0 T) }$ m/ o3 K5 G: ^
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; }
     
109.                         .sideblock dd a { color: #999; }
     . \1 z, H6 ]5 }1 P
110. 
     ) L/ _; [6 W% Q- i0 ^
111. /*单行信息列表*/
     
112. .msgtitlelist { margin: 0; padding: 5px 0; list-style: none; line-height: 1.6em; }
     ' X% t" `+ q1 [% O8 f- N2 o( 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; }
     " A( m9 V. ^: G7 y9 Q8 w
115.         .sideblock .msgtitlelist { background: #FFF; }
     8 j9 J1 q' Q+ u4 z
116. 
     " B4 C' |* g) K
117. /*多行信息列表*/
     
118. .messagelist { margin: 5px 0; padding: 0; list-style: none; line-height: 1.6em; }
     - h% @6 {0 T5 Q
119.         .messagelist li { margin: 5px 0 10px 0;}
     6 X: Z( M5 P* d/ M* V; h( X
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; }
     
122.                                 .messagelist li h4 a:visited { font-weight: normal; }
     ( n* m! q- Z  z# u/ ?- D
123.                 .messagelist li p { margin: 0; }
     
124. 
     - \/ c% ]  J5 g: N
125.         .messagelist dl { margin: 0; padding: 0; line-height: 1.6em; }
     / X) i( @* n' O7 Y
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; }
     & B( o5 q; ?  N6 _
128.                         .messagelist dd a { color: #999; }
     
129. 
     
130. /*热门话题*/
     1 ?, h$ K5 N9 G- k1 A* Q9 M; z
131. #hottag { overflow: hidden;  }
     
132.         #hottag div { background: #FFF; padding: 0.5em; overflow: hidden; line-height: 1.8em; }
     % T( X6 _$ U7 M. m$ {' O
133.                 #hottag div { color: #999; overflow: hidden; }
     
134.                 #hottag a { margin-right: 0.2em; white-space: nowrap; }
     
135.                         #hottag a em { color: #999; font-style: normal; }
     
136. 
     ) T) i3 V0 A& c8 y
137. /*用户面板*/
     / M# h3 ~$ O% \. R- w5 W. K
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; }
     ; z# \2 @' T1 {' Y7 P
142.                 #dologin { float: right; }
     5 M7 L3 z* [* h% V3 u
143.                 #userpanel form a { line-height: 2em; color: #B353B3; border-right: 1px solid #86B9D6; padding-right: 5px; }
     - Q7 E1 x  Q. g
144.         /*登录后*/
     * b6 S" Y0 M! h7 w5 Q- t
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; }
     - ^/ `! G1 y0 \7 m9 `1 O
147. 
     
148. /*空间之星*/
     / l2 V) ]. D' [
149. #spacestar ul { width: 168px; margin: 0 4px; padding: 0; height: 235px; }
     ; ~' ]0 Y4 D- V( y# [- @
150.         #spacestar li { float: left; display: inline; width: 54px; height: 70px; overflow: hidden; margin: 3px 1px; background: #E2F0F9; text-align: center; }
     0 j" \$ C+ J  u/ y
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; }
     / B8 ?1 `5 B. m$ s) c2 u
153. 
     
154. /*同城空间*/
     
155. #cityspace { background: #F0F9FF; }
     9 g/ z1 d0 ~( G9 }2 E$ l# ]1 m( S' G7 r
156. #cityspace form { width: 10.5em; margin: 0 auto; padding: 5px 0; }
     
157.         #cityspace select { margin: 2px 0; }
     ' w7 C- b+ w4 K' {
158.         #cityspace button { float: right; margin-top: 4px; width: 3.5em; height: 3.5em; }
     - g: Q6 e1 p! Y, Q( Q! `4 X: Q4 k
159.         #blogblock #cityspace { margin: 0 0 4px 0; }
     1 B9 L. o( `$ c: }# L: h8 z0 l, J
160. 
     
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; }
     + f4 D: Q) j2 O$ U1 T4 F1 K! j7 u
163.         #hotspace li { height: 20px; overflow: hidden; }
     " J2 g5 K" h: a+ _
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; }
     ! d' N* `1 Q7 J( p
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; }
     
171.                         #hotarticletabs span.active { background: #FFF; color: #333; border: 1px solid #86B9D6; border-bottom: none; }
     
172.         #hotarticle ul { background: #FFF; margin: 0; padding: 0.5em; list-style: none; line-height: 1.7em; height: 16.5em; overflow: hidden; }
     ; f$ E  N7 p6 h- f0 }; L
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. 
     ' m5 @4 a" ^8 {5 ~, p  [
175. /*图片列表*/
     
176. .imgthumblist { margin: 0 3px; padding: 0; list-style: none; }
     3 ^' G2 S4 c  `  y% T9 B+ g! W
177.         /*\*/ * html .imgthumblist { height: 1%; }/**/ *>.imgthumblist { overflow: hidden; }
     
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; }
     , |" c+ o8 Y4 e5 j- X1 }
179.                         .imgthumblist li.list1line { height: 123px; height: 115px; }
     
180.                         .imgthumblist li.list2line { height: 143px; height: 135px; }
     8 \' T1 x# S) d  a
181.                         .contentL .imgthumblist li { margin: 0 1px 3px; }
     7 F: i' X$ r* E2 I' e
182.                         .imgthumblist img { width: 100px; height: 100px; }
     
183.                         .imgthumblist p { margin: 0; text-align: center; line-height: 1.3em; }
     $ Z) N; a' X% _9 {- v1 V; [
184.         .throughgallery { width: 100%; clear: both; margin-bottom: 5px; padding-bottom: 3px; background: #E2F0F9; }
     
185.                 .throughgallery .imgthumblist { margin: 0; }
     5 h9 h0 B7 K0 B: S7 }: P  q: Y
186.                 .throughgallery .imgthumblist li { height: 120px; margin: 3px 1px; }
     
187. 
     7 G' _) g, l8 Q/ g& Q
188. /*商品*/
     8 |' \2 n, I3 |5 Q7 ]
189. /*\*/ * html .goodsthumblist { height: 1%; } /**/ *>.goodsthumblist { overflow: hidden; }
     
190.         .goodsthumblist { margin: 0; padding: 3px 0; list-style: none; }
     % R* X' c1 r- Z( B& r
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. 
     ( D4 S3 S' a+ V( b
195. .imgtitlelist { margin: 10px 0; padding: 0; list-style: none; }
     3 q) m4 y5 O2 X6 C$ H
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; }
     ) }, e* e; R; s6 i) `
199.                         .imgtitlelist li img { float: left; margin-left: -85px; width: 70px; height: 70px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED; }
     ' ^  N. A- P* H6 B
200.                         .imgtitlelist li p { margin: 0; line-height: 1.5em; }
     
201.         .sideblock .imgtitlelist li { padding-left: 65px; }
     
202.                 .sideblock .imgtitlelist li img { width: 48px; height: 48px; margin-left: -60px; }
     
203.        
     2 o7 S0 K- R5 e/ P
204. 
     % j' k* m5 @& S; Z) s
205. /*栏目区块列表*/
     
206. .category {  margin: 4px 0 10px 0; }
     ( U- Q; V6 n: R1 n3 ^
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; }
     & r8 b  V/ Q+ V4 p/ B/ p5 l
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; }
     
212.         .catecommend { background: #F0F9FF; margin: 0; line-height: 2em; height: 2em; overflow: hidden; padding: 0 1em; }*/
     - k# S/ [/ c9 U5 n) }" ~0 k
213.                 .catecommend a { color: #000099; white-space: nowrap; margin-right: 0.5em; }
     " |2 _* j; `; ~# t
214. 
     , y3 A/ s* H% r) g1 e/ s
215. 
     ' j% A3 O$ `/ G" e* }& P% N, V/ w' K
216. /*-----------------------------------------------------------------------------------首页各版块*/
     
217. 
     
218. /*#commendimage { height: 155px; }
     & v) R0 y' m7 C/ d
219. #topicnews { height: 217px; }
     
220. #newgoods, #commendgoods { height: 200px; }
     # h# n' s. t7 q3 U- T' _1 R, g" S" P
221. #hotcommentfile, #hotfile, #newlink, #hotlink { height: 220px; }*/
     
222. 
     ' B, `4 S8 ~0 q; P
223. 
     
224. 
     
225. 
     
226. /*信息列表*/
     
227. .articlelist li { padding-left: 60px; }
     + D) O5 x- Z8 ]& N- F' Q: q( o) {
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; }
     7 _2 c; q; N" ]% W! d* x
230.        
     # `- N; B; g' b8 b1 m; p" l2 r: j# \9 k
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; }
     
235.                 .articlelist h4 a { color: #000099; }
     - y) |" q! D2 x* J7 n5 v8 y$ Z
236.                 .articlelist li img { position: absolute; left: 0!important; left: -67px; top: 0; border: 3px solid #9FC8DF; width: 48px; height: 48px; }
     , Z) M- d( \5 |, T6 B
237.                
     
238.                 .articlelist li strong { font-weight: normal; color: #999; line-height: 2em; padding-left: 0.5em; }
     + o1 G- G% B6 Z3 T. M/ ^, w4 z
239.                         .articlelist li strong a { color: #999; }
     
240.                 .articlelist li p { margin: 0.3em 0; line-height: 1.6em; }
     - e# r0 P5 Q* b
241.                         .articlelist li p a.more { float: none !important; }*/
     ; p) x+ P/ n3 z5 B3 h
242. 
     
243. 
     7 s7 t  _9 X4 c8 F
244. .catepic { text-align: center; }
     ; ?+ k9 u. l( F( X% y2 J8 ]7 C+ F
245.         .catepic img { margin-top: 10px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED;
     
246.                 max-width: 150px; max-height: 150px; width: expression(this.width > 150 ? 150: true); height: expression(this.height > 150 ? 150: true); }
     4 \1 N" [5 K+ `4 D4 f5 m* d
247.         .catepic p { text-align: left; margin: 0.5em; }
     
248. 
       S4 f* V2 r3 J- `5 D
249. /*专题列表*/
     $ H8 `0 j! J! J7 x
250. #subjectlist { border-color: #86B9D6; padding: 2px; }
     
251.         #subjectlist h3 { border: none; background: #9FC8DF; }
     
252.         #subjectlist li { border-bottom: 1px solid #E2F0F9; text-align: center; padding: 3px; }
     ; N$ w- j+ {7 C! y
253.                 #subjectlist p { margin: 0; line-height: 1.2em; }
     
254. 
     
255. 
     ) X2 m- h5 O+ M! D5 Z1 b4 V; X4 p
256.         #xspace-rates { height: 2em; }
     5 n) \3 Z% W0 V
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; }
       S; i7 ~! N3 |4 W
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. 
     / v0 K7 T6 ]9 Q' b9 Z
262. 
     ! J, ~/ x2 k$ D
263. #panel { width: 600px; overflow: hidden; margin: 1em auto; }
     
264. 
     & L$ R% R. U$ q2 ~
265. 
     3 t( H1 `5 w* Q) V5 }
266. /*Pages*/
     
267. .pages { text-align: right; border-top: 1px solid #9FC8DF; }
     
268.         /*.pages table { margin: 3px 0 3px auto; text-align: center; }
     0 P4 p$ `+ n3 L0 \3 }( H" `
269.                 .pages td { padding: 0 5px; border: 1px solid #B9D0ED; background: #FFF; }
     + M) c- J, i. W6 I8 t# g
270.                 .pages a { text-decoration: none; }
     
271.                 .pages .currentpage { background: #F0F9FF; border-color: #86B9D6; font-weight: bold; }*/
     
272. 
     . H$ ?" s5 D! Y
273. /* 分页 */
     9 \1 }+ I1 k/ C; f2 H
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; }
     9 L7 B1 F; {4 a- p, G
276.                 table.xspace-page a:hover { background: #86B9D6; }
     * G5 L+ @; R; F7 O0 E1 R/ y2 A
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; }
     ) Q! B$ }  Y3 ?* [. p
279. 
     
280. .smalltxt { font-size: 12px; color: #999; font-weight: normal; }
     
281.         .smalltxt a, .smalltxt a:visited { color: #999 !important; }
     5 `. t9 S1 O& `$ X
282. 
     ! o$ ^" P! k+ Z7 D" V) D! G/ b
283. /*-----------------------------------------------------------------------------------页脚 Footer*/
     ( _$ [4 d2 ]# c! u8 y& ^
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; }
     * n1 i; G2 x' x& }7 L) Z
288.        
     
289. .imglogolist { margin: 0; padding: 0; list-style: none; text-align: center; }
     - Q* M2 D2 i9 z6 u7 Z, \# r
290.        
     - V# S8 S2 r6 X/ q
291. #articledetail { border: 1px solid #86B9D6; text-align: center; }
     5 I$ x. j0 \. Q! M0 O
292. .articletitle { font-size: 1.6em; margin: 1em 0 0.5em; }
     
293. .articleinfo { border-bottom: 1px solid #9FC8DF; margin: 0;}
     " C( l/ }4 {! r$ x+ M
294. .articlectrl { margin: 0.5em 0 1.5em; }
     
295. 
     * ~" A- P) o& o# g
296.         #articlebody { width: 98%; margin: 0 auto; overflow: hidden; text-align: left; overflow-y: hidden; line-height: 1.8em; font-size: 1.2em; }
     ( ~; x0 T8 @0 t
297.         #articlebody * { line-height: normal; }
     # [! p5 h/ T5 D# ^" G% H
298.                 #articlebody  p, #articlebody  div { line-height: 1.8em !important; margin: 10px 0; }
     
299.                         #articlebody  p *, #articlebody  div * { line-height: normal !important; }
     
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; }
     - _) F% b! c8 H* [8 s1 ^
303.                 #articlebody .addoninfo ul { margin: 0.5em 0 0.5em 2em; padding: 0; }
     
304.                         #articlebody .addoninfo li { line-height: 1.6em !important; }
     
305.        
     
306.         #articlebody img { width: expression(this.width > 500 ? 500: true); max-width: 500px;  }
     : p4 B3 u  r+ O7 V2 j; a
307.        
     
308.         #articlebody kbd.showvideo, #articlebody kbd.showflash { font: 1em Arial, Helvetica, sans-serif; cursor: pointer; text-decoration: underline; }
     - ]( R$ A& @+ d6 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; }
     + @( e$ i5 o( U- r  j% J' Z/ U- {
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; }
     
315.                                                 #commentlist .messagelist li div  p *, #commentlist .messagelist li div  div * { line-height: normal !important; }
     
316. 
     . l8 I  {) |! A. S# J" [: _
317. /*发表评论*/
     
318. #comment { margin-top: 4px; }
     
319.         #comment h3 { margin: 0 5px; font-size: 1em; line-height: 2em; }
     - N3 I1 S  y. t+ n" w
320.         #comment form { background: #FFF; margin: 0; padding: 5px; }
     
321.         #comment p { margin: 0.3em 0; }
     
322.         .seccodeline * { vertical-align: middle; }
     
323.         #xspace-rates { height: 2em; }
     
324.                 #xspace-rates label { float: left; line-height: 24px; margin-right: 5px; }
     7 N) o9 \' E" @; C3 q& P
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; }
     6 R( q* P/ N, o! L, P
328. 
     ) V+ X* E( W5 m; Q5 g, L# ^
329. /*AJAX div*/
     " k/ E% N, b5 j7 X- b3 u- ^9 J
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; }
     4 q4 a' K! e6 d& h" a  x
333.         .xspace-ajaxcontent { background: #FFF; border: 1px solid #EEE; }
     
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; }
   8 n+ D6 T+ @2 n; ^$ Q# V. l  r3 D: y
4. #wrap { background: #FFF; margin: 0 auto; text-align: left; width: 910px; padding: 0 4px; w\idth: 910px; }
   ! n6 E7 b! {* x3 e0 `- u. G
5. 
   ' ]9 p4 X6 F0 U7 v7 M& C

复制代码

2 ]( ~% h6 b2 l9 h9 }3 g0 B
分析
- g# c) W) @( n( e6 \% t- i
" p( O  M! @+ r

1. margin属性说明：
   8 n* R! Y2 T( ^! X( \/ ?9 `
2. 
   ! x' o/ |7 [( O" b6 y+ \* `
3. 检索或设置对象四边的外延边距。
   * ?5 G( Y6 q9 A$ r7 ^( D
4. 如果提供全部四个参数值，将按上－右－下－左的顺序作用于四边。
   - H" U7 t, v: u: T' N
5. 如果只提供一个，将用于全部的四边。
   6 H( C3 }4 ^1 ]! S
6. 如果提供两个，第一个用于上－下，第二个用于左－右。
   3 a) k1 d1 D( W1 \9 q" O& i$ d  n
7. 如果提供三个，第一个用于上，第二个用于左－右，第三个用于下。
   
8. 内联对象要使用该属性，必须先设定对象的height或width属性，或者设定position属性为absolute。
   
9. 在IE4+，margin属性不可用于td和tr对象。
   
10. 外延边距始终透明。
    # b9 ]: S+ C' Y( [3 L
11. 
    
12. color : 　指定颜色
    7 a; V) I" M# a% Y) F# Y
13. text-align:文本的对齐方式。(left : 　左对齐,right : 　右对齐,center : 　居中,justify : 　两端对齐)
    2 M$ r1 N! W% _" Z
14. font: 12px Arial, Helvetica, sans-serif;  :这段是字体相关的
    / H6 b* f- {# T. `
15. 
    
16. 
    

复制代码

傲天♂浪子追风

1. /*链接样式*/
   6 U  C' g' l9 T. p& E8 H  Z
2. a { color: #000; text-decoration: none; }
   
3.         a:hover { text-decoration: underline; color: #000098; }
   
4.                 a:visited { color: #666;}
   $ w4 s" ]3 Y& L& e4 d' X! ^
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; }
   1 y" k5 W( V2 Z- `
7.         a img { border: none; }
   
8. li cite { font-style: normal; font-size: 12px; float: right; width: 4em; color: #999; }
   - G5 L% [( D1 ]+ I
9.         li cite a { color: #999; }
   ! X' K3 e$ g6 Y1 ~; a( ~3 L
10.                 li cite a:visited { color: #999; }
    
11. .more { float: right !important; color: #000098 !important; background: transparent !important; font-size: 12px !important; font-weight: normal !important; cursor: pointer; }
    
12. 
    2 p' N- E' P$ H7 g+ @3 q( N

复制代码

分析
: R- @1 |, `9 _) I

1. 
   
2. text-decoration:文本连接的属性,一般有以下几种参数:
   / A8 R  O4 g5 a3 {& S1 o. b: ~! Y- g0 e
3. none : 　无装饰
   
4. blink : 　闪烁
   
5. underline : 　下划线
   6 c9 K3 W- v' ?+ z" W# i7 K3 f
6. line-through : 　贯穿线
   
7. overline : 　上划线
   % e; n9 v) j: j' m! u# S% p
8. 
   # Y, s/ a( H% h
9. 
   # e& _3 ^1 O' N* k
10. hover:设置对象在其鼠标悬停时的样式表属性。
    6 H/ o! C' J/ p+ g: T
11. 
    - p, i: \" l9 O3 E* e# N, O
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. 
    & _, R: k* r2 O7 @8 n+ A9 L
18. a img { border: none; }图片连接相关
    
19. 
    
20. 
    
21. cite:这个一般是引用标签的时候用的,不知道用来这里做什么
    
22. 
    
23. 
    
24. font-style:字体式样,一般常用参数有:
    
25. normal : 正常的字体
    ! h7 ?7 }  l0 T2 a7 o3 Y& g- p
26. italic : 斜体。对于没有斜体变量的特殊字体，将应用oblique
    ' B# r$ t2 G/ s- I. D7 @7 {/ G7 H
27. oblique : 倾斜的字体
    
28. 
    
29. 
    / g- W* _4 j0 g- ]. o, ?+ Q
30. float: right 该属性的值指出了对象是否浮动及如何浮动。常用参数如下:
    * R8 _- }5 b- ?
31. none : 　对象不浮动
    " @. ^1 h8 M/ S1 b* q9 G
32. left : 　对象浮在左边
    ; [! r4 d. k$ |1 i* m3 M9 a
33. right : 　对象浮在右边
    5 E0 l$ w( F  L) @/ ~0 Z/ o
34. 
    $ X0 V( t& T6 y4 n2 N# n5 q: ?
35. 
    
36. important:样式表条目,提升指定样式规则的应用优先权。
    
37. 
    
38. 
    
39. background: transparent 这个的意思就是背景透明...
    7 Z( t4 F7 c" ~" C# ]. O/ s9 s
40. 
    & y4 L# |' ?* h% V7 \
41. 
    6 T$ C" l! W+ m3 \  A$ ]: ?
42. 
    ( w) O1 V6 b  N
43. font-weight: normal :文本字体的粗细,常用参数如下:
    " I+ _$ m: x+ G$ G
44. normal : 正常的字体。相当于number为400。声明此值将取消之前任何设置
    
45. bold : 粗体。相当于number为700。也相当于b对象的作用
    
46. bolder : IE5+　特粗体
    2 T1 Z' N1 t. A6 u- x- ?; `$ i
47. lighter : IE5+　细体
    
48. number : IE5+　100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
    
49. 
    % B& t) {' n) E" @& W; A
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)
    
53. 
    
54. 
    
55. 
    
56. 
    0 ]% t# k( a6 p5 N; @$ f: B, r
57. 
    
58. 
    7 b+ I  D1 s* ^9 {* q2 I
59. 
    / k, r9 F& S1 Z, N

复制代码

傲天♂浪子追风

1. /*-----------------------------------------------------------------------------------表单通用样式*/
   
2. 
   - }  c0 R. O9 o/ t# u
3. form { margin: 0; }
   3 H# V6 Y( M1 o% s& \( G: P8 S
4.         input, textarea, button, select { font: 1em Arial, Helvetica, sans-serif; }
   
5.         button { height: 1.8em; padding: 0 0.3em; background: #9FC8DF; cursor: pointer; border: 1px solid;
   
6.                 border-top-color: #C9E3F0; border-right-color: #2A8ABA; border-bottom-color: #2A8ABA; border-left-color: #C9E3F0; }
   
7.         fieldset { border: 0; padding: 0; }
   
8.                 legend { display: none; }
   
9.         label { cursor: pointer; margin-right: 0.5em; }
   

复制代码

bronwen

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

傲天♂浪子追风

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

傲天♂疯紫

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