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

傲天♂浪子追风

1. * { word-break: break-all; } /*在IE中实行强制换行*/
   0 E( E: w0 e! u9 D4 {
2. #newsblock { margin-top: 4px; }
   
3. /*-----------------------------------------------------------------------------------综合设置*/
   
4. 
   
5. body { margin: 0; background: #FFF; color: #333; text-align: center; font: 12px Arial, Helvetica, sans-serif; }
   ) i* I( Q  j3 |& i
6. #wrap { background: #FFF; margin: 0 auto; text-align: left; width: 910px; padding: 0 4px; w\idth: 910px; }
   
7. 
   
8. /*链接样式*/
   
9. a { color: #000; text-decoration: none; }
   5 z$ n' k! K6 Z
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; }
    " Z$ `. E4 e8 t) Q2 H+ ^
13.                 #topmenu a:hover, #menu a:hover, .imglist a:hover, #hotspace li a:hover { text-decoration: underline; }
    $ M0 p6 b7 ^* a! d, @5 L
14.         a img { border: none; }
    
15. li cite { font-style: normal; font-size: 12px; float: right; width: 4em; color: #999; }
    7 j$ B* Z4 n8 G. `6 `8 H
16.         li cite a { color: #999; }
    
17.                 li cite a:visited { color: #999; }
    
18. .more { float: right !important; color: #000098 !important; background: transparent !important; font-size: 12px !important; font-weight: normal !important; cursor: pointer; }
    
19. 
    
20. /*-----------------------------------------------------------------------------------表单通用样式*/
    . |! X% c8 ^  z6 ]: T" `# ^
21. 
    ; ~' o+ P, r( c3 T& c
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; }
    % k3 U, u9 C2 v  w4 O- w1 d
27.                 legend { display: none; }
    
28.         label { cursor: pointer; margin-right: 0.5em; }
    3 k- z$ ]1 p, b; S1 @/ {1 ]& c5 x( r
29. 
    * i# C/ M1 |5 P: p3 O. e: Z
30. /*-----------------------------------------------------------------------------------头部风格 Header*/
    - I9 D; I/ m% E" h  q* v
31. /*顶部导航*/
    $ o5 _0 Y! N3 z$ e; P
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; }
    # o6 i  x, U% X* k3 C0 A1 E
36. 
    # s- m$ Y0 S! K# ]9 m; l/ t
37. #pagetitle { padding: 8px 0; height: 76px; he\ight: 60px; border-bottom: 4px solid #F5FBFF; }
    
38.         #logo { border-right: 1px solid #86B9D6; padding: 0 10px; margin-right: 10px; }
    ; Y) H: k; C/ `* t
39.         .banner468 { float: right; }
    * N4 T) k6 G- F
40. 
    
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; }
    : M$ G* H9 G5 X  B$ Y/ Y7 ~
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; }
    9 ]3 t- [# r  ?9 p) V
45.         /*首页导航*/
    3 ]# D# I9 f4 |3 I9 `) O
46.         #menu dl { margin: 0 1.5em; padding: 0; height: 25px; overflow: hidden; }
    
47.                 #menu dt { float: left; width: 4em; white-space: nowrap; }
    4 T9 ~+ @% M' `+ q7 `
48.                         #menu dt a { color: #000098 !important; }
    
49.                 #menu dd { float: left; width: 6em; margin: 0 2px; overflow: hidden; white-space: nowrap; }
    + @7 C$ F) s6 B; M
50. 
    
51. /*您的位置导航*/
    1 ]4 w  {9 L  T) f
52. #navigation { padding: 1.2em 0; }
    ) ~& ?8 ^5 k4 ~; c8 T' c7 Z' e
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; }
    : b- g! K- k( K4 g. Y8 Y4 p! N( w
57.                 #searchform button { margin-left: 0.5em; }
    
58. 
    3 ]4 H) N3 E  j8 g) q1 H0 k& q! t
59.         #navigation.simplepage { padding: 0; border-top: 2px solid #009DEA; border-bottom: 1px solid #009DEA; line-height: 25px; background: #EFF5FF; margin-bottom: 1em; }
    + U! V: |* ?5 _4 i
60.                 #navigation.simplepage p { float: right; margin-right: 0.5em; }
    ( A% p  w. ~' e' A
61.                 .simplepage h2 { margin: 0; font-size: 1.2em; padding-left: 0.5em; }
    # @% y/ j# Q8 t7 N
62. 
    . k. f+ N3 f) r& r2 J1 R' m
63. /*-----------------------------------------------------------------------------------布局*/
    
64. 
    
65. .content { /*三列布局*/
    , @6 B- R1 X7 R: V, Q* d1 g0 ^
66.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y 0 0; }
    
67.         /*\*/ * html .content { height: 1%; } /**/ *>.content { overflow: hidden; }
      V5 h7 t8 `( |( a+ q0 O  W  l
68. .contentL { /*两列布局，侧边在左侧*/
    
69.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y -590px 0; }
    . v7 @& N1 R3 |2 r. Z; b
70.         /*\*/ * html .contentR { height: 1%; } /**/ *>.contentR { overflow: hidden; }
    
71. .contentR { /*两列布局，侧边在右侧*/
    0 U, y* h$ N5 S: k
72.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y 580px 0; }
    : \" B# H/ A7 E1 e
73.         /*\*/ * html .contentR { height: 1%; } /**/ *>.contentR { overflow: hidden; }
    
74. /*侧边样式*/
    
75. .sideL { width: 296px; float: left; overflow: hidden; }
    0 }+ j" x) @4 l9 V
76. .sideR { width: 202px; float: right; overflow: hidden; }
    
77. /*中间部分样式*/
    
78. .mainarea { margin: 0 4px; width: 382px; float: left; }
    4 W' P. v/ ?5 O0 e8 M2 S
79.         .contentL .mainarea { margin: 0 0 0 4px; width: 556px; }
    
80.         .contentR .mainarea { margin: 0 4px 0 0; width: 576px; }
    4 Q# y" _  [% r0 `
81. 
    5 S7 e/ t( k. j2 }" b* W
82. /*-----------------------------------------------------------------------------------版块样式*/
    
83. 
    + h4 [& {. ?/ l- w% E0 Z) g3 z3 R
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; }
    " w3 \# P# y1 Z+ h: }
87.         .blocktitle .more { margin-right: 5px; }
    4 o: _8 l# S! E* C! p2 ]
88. 
    3 @8 z) d% q7 A8 B( Y4 A9 h
89. /*头条信息*/
    
90. #headline { padding: 5px; height: 70px; he\ight: 58px; overflow: hidden; }
    
91.         #headline strong { font-size: 1.2em; }
    
92.         #headline p { margin: 0.3em 0; }
    
93.         #headline img { float: right; width: 48px; height: 48px; border: 4px solid #FFF; }
    
94. 
    , {! m9 I1 N" }" q( I4 ]) w) H
95. /*侧边版块*/
    4 m0 f% x; r$ S
96. .sideblock { margin: 0 0 3px; border: 1px solid #86B9D6; background: #FFF; padding: 3px; }
    9 D3 w* Z/ s5 }
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; }
    % S  c  Q, P& g4 u
100.                         /*\*/ * html .sideblock h3 { height: 1%; } /**/
     $ |0 l( l1 {, G( n, Y
101.                 .sideblock p { margin: 0.3em; line-height: 1.6em; }
     0 p) ?$ H" C( f9 P" |
102.                         .headimg { float: right; margin: 5px 0 2px 5px; width: 80px; height: 80px; border: 4px solid #E2F0F9; }
     ! g) l4 p- W. B
103. 
     % J7 k; J* T& }9 r* p
104.         /*侧边多行列表*/
     + K7 e& e. s/ Z8 ]2 O$ [
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; }
     ' ]9 ~+ U' N, Z# Y: Y
108.                 .sideblock dd { color: #999; margin-left: 0.8em; }
     ' F5 @2 ~& Z1 s+ x) \  a! y
109.                         .sideblock dd a { color: #999; }
     ( F8 i+ m2 y2 [! |
110. 
     
111. /*单行信息列表*/
     
112. .msgtitlelist { margin: 0; padding: 5px 0; list-style: none; line-height: 1.6em; }
     ; M/ Q) F# 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; }
     ! h; w$ t3 l$ ]2 g. I
115.         .sideblock .msgtitlelist { background: #FFF; }
     
116. 
     
117. /*多行信息列表*/
     0 n4 Z; R- t. q/ H' l! n
118. .messagelist { margin: 5px 0; padding: 0; list-style: none; line-height: 1.6em; }
     
119.         .messagelist li { margin: 5px 0 10px 0;}
     
120.                 .messagelist li h4 { margin: 5px 0; font-size: 1em; line-height: 2em; background: #F0F9FF; }
     
121.                         .messagelist li h4 a { color: #009; font-size: 1.2em; }
     8 R8 s2 }: Z. u8 c* y) m0 x( a' @
122.                                 .messagelist li h4 a:visited { font-weight: normal; }
     
123.                 .messagelist li p { margin: 0; }
     . o: X: b0 L) m( D8 w
124. 
     # X& q. v4 s" U- l
125.         .messagelist dl { margin: 0; padding: 0; line-height: 1.6em; }
     - ^3 _: m4 J! }' P/ C. T! a
126.                 .messagelist dt { background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.7em; padding-left: 0.8em; }
     & }9 z& v4 S& ?$ X3 D
127.                 .messagelist dd { font-size: 12px; margin: 0; padding-left: 1em; color: #999; }
     
128.                         .messagelist dd a { color: #999; }
     
129. 
     
130. /*热门话题*/
     5 I# H$ T2 @8 d1 Q7 F9 Z
131. #hottag { overflow: hidden;  }
     
132.         #hottag div { background: #FFF; padding: 0.5em; overflow: hidden; line-height: 1.8em; }
     5 {6 t! ~0 j: S; _# h! p# |; L
133.                 #hottag div { color: #999; overflow: hidden; }
     ' o: }2 Q" Y! D  T0 {7 y+ P& b3 y
134.                 #hottag a { margin-right: 0.2em; white-space: nowrap; }
     8 \# m  @: s# K' B
135.                         #hottag a em { color: #999; font-style: normal; }
     
136. 
     & A" T2 Q  h' c: u* [
137. /*用户面板*/
     
138. #userpanel { height: 8.8em; overflow: hidden; }
     8 V7 Z% N5 ?1 ~2 i$ y$ t: {& j
139.         #userpanel form { margin: 5px auto !important; margin: 0 auto; width: 150px; }
     ( N5 q7 L2 S; e
140.                 #userpanel input { width: 90px; }
     
141.                 #userpanel p { margin: 0.5em 0; }
     
142.                 #dologin { float: right; }
     8 |1 [) p' z2 ?5 S. F* G6 p# _
143.                 #userpanel form a { line-height: 2em; color: #B353B3; border-right: 1px solid #86B9D6; padding-right: 5px; }
     3 i7 L& Z" y: N# Z1 X, H9 I
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; }
       j, |7 E( s  i/ p2 `
147. 
     
148. /*空间之星*/
     . Z) u3 l  m6 O; p4 {
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; }
     
151.         #spacestar img { width: 48px; height: 48px; margin-top: 3px; }
     . x# L" \9 r7 H# \' f* d0 G, P* H
152.         #spacestar p { margin: -4px 0 !important; margin: 0 0; line-height: 20px; height: 20px; }
     
153. 
       ^: W! I& I! ?' V
154. /*同城空间*/
     5 U7 ~1 o% r6 M/ Q: v: ?" v
155. #cityspace { background: #F0F9FF; }
     : S1 J% s( Y- {
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; }
     
160. 
     
161. /*空间排行*/
     ; E# m1 I( {. `! Y. m" c
162. #hotspace ol { margin: 0; padding: 0 0 0 20px; line-height: 20px; background: url(../images/new/hotspace_bg.gif) no-repeat; list-style: none; }
     
163.         #hotspace li { height: 20px; overflow: hidden; }
     8 c: v( X9 q6 n6 d3 X/ Y7 r; ?
164.         #hotspace em { float: right; font-style: normal; font-size: 9px; color: #999; width: 40px; }
     : n( m# L0 d5 G! w" y9 {
165. 
     
166. /*热门文章 */
     ! i; u2 {  g3 @+ h) r
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; }
     % I+ Y0 m' d; |9 Y% [
169.         #hotarticletabs { position: absolute; margin: 0; line-height: 18px; top: 7px!important; top: 8px; right: 10px; }
     * o7 b" [# p) I
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; }
     ( H) f' k& G& f( o
172.         #hotarticle ul { background: #FFF; margin: 0; padding: 0.5em; list-style: none; line-height: 1.7em; height: 16.5em; overflow: hidden; }
     
173.                 #hotarticle li { height: 1.7em; overflow: hidden; color: #999; padding-left: 0.8em; background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.7em; }
     & V) V& q3 O& S9 _$ p, [
174. 
     + y: w4 Q5 C" V4 r% |2 X! E' [
175. /*图片列表*/
     ; Z4 [; O: P0 f( W3 d/ M
176. .imgthumblist { margin: 0 3px; padding: 0; list-style: none; }
     
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; }
     - E2 V1 A* o; ]& Q, X; E8 \6 P
179.                         .imgthumblist li.list1line { height: 123px; height: 115px; }
     ) T) g/ |5 }/ O/ n  Y. ~7 q& w
180.                         .imgthumblist li.list2line { height: 143px; height: 135px; }
     ' }! z5 q" s+ Z7 Z1 d& \/ ]3 z
181.                         .contentL .imgthumblist li { margin: 0 1px 3px; }
     ( n- r6 t0 m: `2 z, e* q+ F! A
182.                         .imgthumblist img { width: 100px; height: 100px; }
     
183.                         .imgthumblist p { margin: 0; text-align: center; line-height: 1.3em; }
     $ I: N( ?5 s- h. c. M/ ^: B
184.         .throughgallery { width: 100%; clear: both; margin-bottom: 5px; padding-bottom: 3px; background: #E2F0F9; }
     
185.                 .throughgallery .imgthumblist { margin: 0; }
     ' w0 H5 k$ c9 o' D7 @) u4 m; Y
186.                 .throughgallery .imgthumblist li { height: 120px; margin: 3px 1px; }
     
187. 
     
188. /*商品*/
     
189. /*\*/ * html .goodsthumblist { height: 1%; } /**/ *>.goodsthumblist { overflow: hidden; }
     5 m; ]* ]: _' }5 m5 g
190.         .goodsthumblist { margin: 0; padding: 3px 0; list-style: none; }
     
191.                 .goodsthumblist li { float: left; width: 90px; height: 100px; text-align: center; }
     8 D' r, L1 C7 n' ~2 `5 s& Q/ q8 w  @
192.                         .goodsthumblist li img { width: 70px; height: 70px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED; }
     & J  O, {6 d' Y; B: ?
193.                         .goodsthumblist li p { margin: -3px 0 0 !important; margin: 0; height: 1.5em; line-height 1.5em; overflow: hidden; }
     
194. 
       z& B+ ~4 k2 Q6 o$ d3 y, f- w2 k
195. .imgtitlelist { margin: 10px 0; padding: 0; list-style: none; }
     / `7 z- n% \: }7 v% f
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; }
     # s( m: ^: B; x/ R' L
198.                         .imgtitlelist li h4 { margin: 0.3em 0; font-size: 1em; }
     % l  L9 o2 U/ R9 F2 [7 [, W7 l
199.                         .imgtitlelist li img { float: left; margin-left: -85px; width: 70px; height: 70px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED; }
     7 l$ ^& T7 r! ]( ~8 Q
200.                         .imgtitlelist li p { margin: 0; line-height: 1.5em; }
     
201.         .sideblock .imgtitlelist li { padding-left: 65px; }
     0 [5 c" o5 T7 x! T. h! q9 k
202.                 .sideblock .imgtitlelist li img { width: 48px; height: 48px; margin-left: -60px; }
     6 N4 t3 h% G# z' I- @% h5 x
203.        
     9 t% j" r6 p, q% S+ H0 P6 {& I1 l
204. 
     " R  p8 u6 J& k! y9 c( F0 k
205. /*栏目区块列表*/
     " V! x5 l' W, K7 Z( b' C4 e2 A
206. .category {  margin: 4px 0 10px 0; }
     
207.         .category h3 { margin: 0 0 5px; font-size: 1.2em; line-height: 1.8em; height: 1.8em; border-bottom: 1px solid #86B9D6; }
     
208.                 .category h3 strong { background: #E9ECEF; float: left; padding: 0 8px; }
     0 T% y9 S% N2 Q9 F& @
209.                         .category h3 strong a { color: #333; text-decoration: none; }
     , z% B. c) f) {
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; }*/
     " v; d' f* c1 F) V
213.                 .catecommend a { color: #000099; white-space: nowrap; margin-right: 0.5em; }
     ' n" I* m) `6 b/ O6 g
214. 
     6 @' M; M& O4 c
215. 
     0 m* F! v; K. p+ T5 J' v
216. /*-----------------------------------------------------------------------------------首页各版块*/
     
217. 
     
218. /*#commendimage { height: 155px; }
     
219. #topicnews { height: 217px; }
     1 q* ^; u% c5 G  ?5 f/ Q# _
220. #newgoods, #commendgoods { height: 200px; }
     ' L8 Q# r/ P" {8 y/ x) m
221. #hotcommentfile, #hotfile, #newlink, #hotlink { height: 220px; }*/
     ) ^3 I3 S; x& \7 T* {
222. 
     * X# o6 g# V2 W5 h# ^& X
223. 
     8 G8 ~# q: W$ c1 f
224. 
     
225. 
     & O) n; s! r7 d5 f7 Z% `( E0 b$ s
226. /*信息列表*/
     5 M; k. t7 o( ?
227. .articlelist li { padding-left: 60px; }
     ! b- P+ U, I9 f2 t( f' i: x# `6 j
228.         .articlelist h4 img { float: left; margin-left: -60px; width: 48px; height: 48px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED; }
     , k7 y# ^0 R* v; D
229. /*.articlelist  h3 a { font-size: 12px; font-weight: normal; margin-left: 1em; color: #B353B3; }
     
230.        
     % J+ x* x7 c% m8 p" y/ l
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; }
     4 y! o: r4 ~& P" h& N2 n
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; }
     . F( Z3 L  y' N
235.                 .articlelist h4 a { color: #000099; }
     
236.                 .articlelist li img { position: absolute; left: 0!important; left: -67px; top: 0; border: 3px solid #9FC8DF; width: 48px; height: 48px; }
       M& R, J7 L& I) x7 z5 v0 q- x
237.                
     
238.                 .articlelist li strong { font-weight: normal; color: #999; line-height: 2em; padding-left: 0.5em; }
     
239.                         .articlelist li strong a { color: #999; }
     % A' l% s+ `2 h% ~( G
240.                 .articlelist li p { margin: 0.3em 0; line-height: 1.6em; }
     " F% j( E) N* P. f
241.                         .articlelist li p a.more { float: none !important; }*/
     2 T6 d7 _# c# l, o5 N7 I
242. 
     / k, d6 z: z+ c7 S9 `# w/ @9 n7 q
243. 
     
244. .catepic { text-align: center; }
     0 d( n4 l9 V, ~& r
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); }
     
247.         .catepic p { text-align: left; margin: 0.5em; }
     
248. 
     
249. /*专题列表*/
     
250. #subjectlist { border-color: #86B9D6; padding: 2px; }
     5 W5 C3 i1 g# Z/ u( I4 b$ l
251.         #subjectlist h3 { border: none; background: #9FC8DF; }
     
252.         #subjectlist li { border-bottom: 1px solid #E2F0F9; text-align: center; padding: 3px; }
     : @0 H: D- ~$ H
253.                 #subjectlist p { margin: 0; line-height: 1.2em; }
     
254. 
     
255. 
     
256.         #xspace-rates { height: 2em; }
     8 Y1 `: n! x. d  X
257.                 #xspace-rates label { float: left; line-height: 24px; margin-right: 5px; }
     7 [/ X- k2 {% _1 N- s
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; }
     9 _* w8 {+ ^+ G% j) n. c: ~7 N5 o0 A
259.                         #xspace-rates a:hover { border-color: #CCC; }
     $ E0 O& a& k% ?( K
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; }
     ) ~# z% |% Z; }) K2 h% f% M
261. 
     
262. 
     
263. #panel { width: 600px; overflow: hidden; margin: 1em auto; }
     8 Z" K$ Z5 C4 u
264. 
     
265. 
     7 f2 A2 A9 H' `* `9 m* Z
266. /*Pages*/
     
267. .pages { text-align: right; border-top: 1px solid #9FC8DF; }
     
268.         /*.pages table { margin: 3px 0 3px auto; text-align: center; }
     2 p  {! T7 Z0 |( q6 W" Y5 C" d
269.                 .pages td { padding: 0 5px; border: 1px solid #B9D0ED; background: #FFF; }
     * x. w" _# B& H3 `" w
270.                 .pages a { text-decoration: none; }
     
271.                 .pages .currentpage { background: #F0F9FF; border-color: #86B9D6; font-weight: bold; }*/
     
272. 
     3 j3 v0 Q* D: H: a4 J6 \
273. /* 分页 */
     
274. .xspace-page { margin: 2px 2px 2px auto; }
     : a# T" d: A/ S) g
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. 
     
280. .smalltxt { font-size: 12px; color: #999; font-weight: normal; }
     , G/ Q; g3 O1 n! }
281.         .smalltxt a, .smalltxt a:visited { color: #999 !important; }
     
282. 
     
283. /*-----------------------------------------------------------------------------------页脚 Footer*/
     + d0 P- h$ t9 ^8 N6 S$ ~" P3 z
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; }
     3 w( P. \& j7 m2 Y
285.         #footer p { margin: 0.3em 0; color: #999; }
     : y0 W/ T/ }* {8 V+ {
286.         #footer strong { color: #007AB6; }
     
287.         #footer em { font-style: normal; font-weight: bold; color: #96A800; }
     
288.        
     6 [3 A+ v) n) O9 X/ @
289. .imglogolist { margin: 0; padding: 0; list-style: none; text-align: center; }
     ) h5 u+ B* u) x& E, s9 i& W" y
290.        
     3 z. w8 j+ \$ N% `2 J
291. #articledetail { border: 1px solid #86B9D6; text-align: center; }
     
292. .articletitle { font-size: 1.6em; margin: 1em 0 0.5em; }
     / ]& G6 J$ ^: @: n3 x7 X- D
293. .articleinfo { border-bottom: 1px solid #9FC8DF; margin: 0;}
     7 \0 s% i9 I, f# q0 }
294. .articlectrl { margin: 0.5em 0 1.5em; }
     
295. 
     1 k7 |0 s2 F0 W& u, r
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' `; f2 L9 Z7 ]7 a/ M
298.                 #articlebody  p, #articlebody  div { line-height: 1.8em !important; margin: 10px 0; }
     ) A. i, e3 [8 [4 z, q- q) f: P2 X2 j
299.                         #articlebody  p *, #articlebody  div * { line-height: normal !important; }
     
300.        
     1 _0 @  Y5 `. L+ B
301.         #articlebody .addoninfo { border: 1px solid #EEE; }
     & e( o. H* b& Q3 E* Q
302.                 #articlebody .addoninfo h5 { font-size: 1em; margin: 0; line-height: 2em !important; border-bottom: 1px solid #EEE; padding-left: 1em; }
     ! s/ ?: y, s$ W7 w8 q
303.                 #articlebody .addoninfo ul { margin: 0.5em 0 0.5em 2em; padding: 0; }
     
304.                         #articlebody .addoninfo li { line-height: 1.6em !important; }
     4 k- d* Y9 q9 H% w3 h  t
305.        
     $ J( N+ l2 k9 L- n
306.         #articlebody img { width: expression(this.width > 500 ? 500: true); max-width: 500px;  }
     + ^8 u1 N  O# k4 E* p9 A; ]5 ^
307.        
     6 Z( h6 [6 z& U" _3 V
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; }
     
310.                 #commentlist h3 { font-size: 1em; line-height: 2em; margin: 0; background: #F0F9FF; border-bottom: 1px solid #86B9D6; }
     7 X; P6 u6 X8 T
311.                                 #commentlist img { max-width: 500px; width: expression(this.width > 500 ? 500: true); }
     ' `7 D+ W' {) A; w8 I% d( ]# A
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; }
     ' m: N3 N, b, U1 P1 c
314.                                         #commentlist .messagelist li div  p, #commentlist .messagelist li div  div { line-height: 1.8em !important; margin: 10px 0; }
     ) \) t4 z9 ?' |0 o% t1 B, C% c5 C
315.                                                 #commentlist .messagelist li div  p *, #commentlist .messagelist li div  div * { line-height: normal !important; }
     3 X' G" e% v  r( V
316. 
     
317. /*发表评论*/
     
318. #comment { margin-top: 4px; }
     
319.         #comment h3 { margin: 0 5px; font-size: 1em; line-height: 2em; }
     
320.         #comment form { background: #FFF; margin: 0; padding: 5px; }
     + E# q/ i/ R: T$ `
321.         #comment p { margin: 0.3em 0; }
     5 U6 _  [( e% ~4 ~  P: E# E, V
322.         .seccodeline * { vertical-align: middle; }
     ' o2 {' e4 c; o
323.         #xspace-rates { height: 2em; }
     
324.                 #xspace-rates label { float: left; line-height: 24px; margin-right: 5px; }
     ' z, N9 Z5 x3 _4 ?6 J" |7 }
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; }
     $ |. c3 O2 U  w& N" u
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; }
     
328. 
     
329. /*AJAX div*/
     
330. .xspace-ajaxdiv { position:absolute; padding: 5px; border: 1px solid #BBB; background: #FCFFEF; text-align: left; }
     4 r6 ^5 h  L9 E) I3 a2 H
331.         .xspace-ajaxdiv h5 { line-height: 24px; font-size: 1em; margin: 0; }
     
332.                 .xspace-ajaxdiv h5 a { float: right; font-weight: normal; }
     
333.         .xspace-ajaxcontent { background: #FFF; border: 1px solid #EEE; }
       j& f$ d' ~$ p0 m) v% Q- o
334.                 .xspace-ajaxcontent form { margin: 0; }

复制代码

傲天♂浪子追风

1. /*-----------------------------------------------------------------------------------综合设置*/
   : M$ z! m& A3 l8 g& c+ Q( D0 J% O
2. 
   2 l2 M/ o7 n1 Z: {5 ^
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. 
   0 E9 Z3 g8 O4 Z6 ?

复制代码

: A) k; Q  p% V- l7 g: e分析
# g* K& p5 w. {' B# O' @! B5 P
( p1 k4 L2 g! x( Q( _, n

1. margin属性说明：
   ; |% ]6 ?1 A' K
2. 
   1 Y" n( y/ l( `+ A. N/ o7 [
3. 检索或设置对象四边的外延边距。
   
4. 如果提供全部四个参数值，将按上－右－下－左的顺序作用于四边。
   
5. 如果只提供一个，将用于全部的四边。
   
6. 如果提供两个，第一个用于上－下，第二个用于左－右。
   
7. 如果提供三个，第一个用于上，第二个用于左－右，第三个用于下。
   1 Y5 ?' [, v/ g
8. 内联对象要使用该属性，必须先设定对象的height或width属性，或者设定position属性为absolute。
   , r+ ?5 y! D" C: {' T
9. 在IE4+，margin属性不可用于td和tr对象。
   
10. 外延边距始终透明。
    
11. 
    " _- W8 j; |8 `( s! k' K# a6 d
12. color : 　指定颜色
    3 p; ?4 |% ~' d' ]  f
13. text-align:文本的对齐方式。(left : 　左对齐,right : 　右对齐,center : 　居中,justify : 　两端对齐)
    
14. font: 12px Arial, Helvetica, sans-serif;  :这段是字体相关的
    
15. 
    
16. 
    

复制代码

傲天♂浪子追风

1. /*链接样式*/
     ~; u" J7 [/ d' |+ B: Q
2. a { color: #000; text-decoration: none; }
   # f+ T+ k, d7 ^) K3 y8 h
3.         a:hover { text-decoration: underline; color: #000098; }
   . B2 [0 O7 i9 @3 h
4.                 a:visited { color: #666;}
   4 w8 T! M2 i/ |6 C; ?
5.         #topmenu a, #menu a, .imglist a, #hotspace li a { text-decoration: none; }
   
6.                 #topmenu a:hover, #menu a:hover, .imglist a:hover, #hotspace li a:hover { text-decoration: underline; }
   7 Q5 L1 o. V8 i: p; O1 d1 w
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; }
   , ?  }0 ^$ H& F' N, D& `5 m# \
10.                 li cite a:visited { color: #999; }
    
11. .more { float: right !important; color: #000098 !important; background: transparent !important; font-size: 12px !important; font-weight: normal !important; cursor: pointer; }
    
12. 
    ! X  H  p2 ^6 F8 {

复制代码

+ ^3 Y* y4 H4 X3 s" d4 B: ^
分析
* C1 O" ~" n" b5 E& f4 S' l
' ~5 h; s/ l+ X" m/ I# D

1. 
   7 N; z5 u4 s/ Z3 y0 C6 k
2. text-decoration:文本连接的属性,一般有以下几种参数:
   
3. none : 　无装饰
   
4. blink : 　闪烁
   
5. underline : 　下划线
   : o3 D  J5 g. y; C  a" M
6. line-through : 　贯穿线
   : C& k# E7 x  D" t: l& V$ J
7. overline : 　上划线
   8 a+ A/ k2 @& E! c6 E
8. 
   
9. 
   
10. hover:设置对象在其鼠标悬停时的样式表属性。
    
11. 
    $ `2 |7 h( r/ }
12. visited:对象在其链接地址已被访问过时的样式表属性。
    
13. 
    ' M2 a! [" h+ B$ d6 C1 o3 H/ w
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; }:
    ' G2 t' y, \& \
16. 上面这两行是与鼠标相关
    
17. 
    
18. a img { border: none; }图片连接相关
    
19. 
    
20. 
    
21. cite:这个一般是引用标签的时候用的,不知道用来这里做什么
    
22. 
    
23. 
    2 Q+ i5 R# B6 u% M1 _. R7 v" E- }
24. font-style:字体式样,一般常用参数有:
    
25. normal : 正常的字体
    
26. italic : 斜体。对于没有斜体变量的特殊字体，将应用oblique
    
27. oblique : 倾斜的字体
    
28. 
    
29. 
    ' }, }2 x6 |) x3 d+ |
30. float: right 该属性的值指出了对象是否浮动及如何浮动。常用参数如下:
    : {. q+ r/ ~8 _. {& [
31. none : 　对象不浮动
    / G/ Y$ \( |  k0 \
32. left : 　对象浮在左边
    # S; m% l! P& K" ~$ R- g& g/ v
33. right : 　对象浮在右边
    . G: I2 b; X! c
34. 
    & y8 I9 R% I( m  t$ \& g
35. 
    
36. important:样式表条目,提升指定样式规则的应用优先权。
    8 c# r$ J  _) x' Z  q$ ]5 n
37. 
    * J7 n' m6 O; A$ Q" x' x
38. 
    
39. background: transparent 这个的意思就是背景透明...
    % }3 Z4 v3 O; y3 a2 L7 K
40. 
    6 ~% P4 Z; n2 Y9 ~6 Y& X, x2 [
41. 
    8 z1 U/ @- ~2 f# O2 |3 S
42. 
    
43. font-weight: normal :文本字体的粗细,常用参数如下:
    9 M  d+ d& N( J5 x2 G; ?  W
44. normal : 正常的字体。相当于number为400。声明此值将取消之前任何设置
    
45. bold : 粗体。相当于number为700。也相当于b对象的作用
    
46. bolder : IE5+　特粗体
    # T) L! {3 t8 {( N1 m' S
47. lighter : IE5+　细体
    % T$ |6 j$ k# {: D
48. number : IE5+　100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
    0 \$ E- @0 l4 x. J) G5 S' B! a2 `
49. 
    
50. cursor: pointer:这个是鼠标放在对象中的状态,简单点来可以这样说,也就是鼠标放在连接上的时候显示的鼠标形状,一般有以下N种参数,这个真的是TMD的多啊
    * [2 Y" W4 |6 Y) w5 G- I
51. 语法：(每一竖隔开为一个状态)
    - i: h% b! n7 P* S! n
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. 
    5 j0 d( b# H( ], _
54. 
    
55. 
    
56. 
    
57. 
    
58. 
    
59. 
    ! c$ H# B0 K6 Q. S  P- Q  w. C

复制代码

傲天♂浪子追风

1. /*-----------------------------------------------------------------------------------表单通用样式*/
   * b* Q. f& w2 \3 g3 D
2. 
   
3. form { margin: 0; }
   & v$ r  W" h5 w, o$ B0 r
4.         input, textarea, button, select { font: 1em Arial, Helvetica, sans-serif; }
   2 D2 N/ a- f4 |& e; {
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; }
   9 Z. K2 T) d" Q
7.         fieldset { border: 0; padding: 0; }
   $ ~5 ?- M# W3 d; r; E
8.                 legend { display: none; }
   % C1 [" h! p& D' o
9.         label { cursor: pointer; margin-right: 0.5em; }
   

复制代码

bronwen

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

傲天♂浪子追风

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

傲天♂疯紫

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