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

傲天♂浪子追风

1. * { word-break: break-all; } /*在IE中实行强制换行*/
   / A( B% }& L# g" k# \" }
2. #newsblock { margin-top: 4px; }
   
3. /*-----------------------------------------------------------------------------------综合设置*/
   ; @' Y4 w0 Q9 Y8 q  [# l, d
4. 
   
5. body { margin: 0; background: #FFF; color: #333; text-align: center; font: 12px Arial, Helvetica, sans-serif; }
   - D. p, f% \/ y# u4 L
6. #wrap { background: #FFF; margin: 0 auto; text-align: left; width: 910px; padding: 0 4px; w\idth: 910px; }
   + r9 A4 T5 {' A0 v
7. 
   ) z$ b" g9 l! Y  @2 R  D
8. /*链接样式*/
   , x8 P+ i, M, [4 v/ L) X  [
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; }
    . p$ n0 ^( [' W+ m
13.                 #topmenu a:hover, #menu a:hover, .imglist a:hover, #hotspace li a:hover { text-decoration: underline; }
    ! ?$ m2 M1 E0 r4 R" i  ]5 c
14.         a img { border: none; }
    
15. li cite { font-style: normal; font-size: 12px; float: right; width: 4em; color: #999; }
    
16.         li cite a { color: #999; }
    
17.                 li cite a:visited { color: #999; }
    $ ~. Y$ Z( w) F( |, y
18. .more { float: right !important; color: #000098 !important; background: transparent !important; font-size: 12px !important; font-weight: normal !important; cursor: pointer; }
    
19. 
    0 C. ?" D# K: M; g% k. u& x
20. /*-----------------------------------------------------------------------------------表单通用样式*/
    0 `0 s6 H5 V& l/ n8 V
21. 
    
22. form { margin: 0; }
    
23.         input, textarea, button, select { font: 1em Arial, Helvetica, sans-serif; }
    5 Y: h6 |" D: y) m6 j
24.         button { height: 1.8em; padding: 0 0.3em; background: #9FC8DF; cursor: pointer; border: 1px solid;
    # @. Y) C  r5 Z0 g: l4 V3 N
25.                 border-top-color: #C9E3F0; border-right-color: #2A8ABA; border-bottom-color: #2A8ABA; border-left-color: #C9E3F0; }
      ^. Z% O) N* q6 N& D7 R
26.         fieldset { border: 0; padding: 0; }
    
27.                 legend { display: none; }
    5 K% c8 O+ L0 q: O! ^3 I5 c
28.         label { cursor: pointer; margin-right: 0.5em; }
    7 A# s1 M) \( V2 Z8 }% H
29. 
    
30. /*-----------------------------------------------------------------------------------头部风格 Header*/
    : H, _7 \$ j+ K8 q' F% I5 Q
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; }
    $ Y; E" z: \  f7 ?
33.         #topmenu ul { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid #86B9D6; }
    & ?3 T  o6 n1 R& g3 l
34.                 #topmenu li { display: inline; border-left: 1px solid #86B9D6; padding-left: 1em; padding-right: 0.5em; }
    
35.                         #topmenu a { color: #154BA0; }
    9 W+ `, x4 k* w9 d/ g, m
36. 
    
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; }
    
39.         .banner468 { float: right; }
    
40. 
    # v- Y& K$ y( M; s
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; }
    
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; }
    , o/ A- t& h# u# M7 l: d
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; }
    
49.                 #menu dd { float: left; width: 6em; margin: 0 2px; overflow: hidden; white-space: nowrap; }
    1 {9 u8 u1 N  x5 P
50. 
    9 q. T8 |. f& k. m( ?$ n
51. /*您的位置导航*/
    
52. #navigation { padding: 1.2em 0; }
    
53.         #navigation p { margin: 0;}
    
54.                 #navigation p a, #navigation p strong { margin: 0 0.5em; }
    
55.         #searchform { float: right; }
    9 U) R* v' ?7 Z. i1 `
56.                 #searchform * { vertical-align: top; }
    
57.                 #searchform button { margin-left: 0.5em; }
    
58. 
    
59.         #navigation.simplepage { padding: 0; border-top: 2px solid #009DEA; border-bottom: 1px solid #009DEA; line-height: 25px; background: #EFF5FF; margin-bottom: 1em; }
    7 h' b  G) m! L1 w- K4 o! I
60.                 #navigation.simplepage p { float: right; margin-right: 0.5em; }
    
61.                 .simplepage h2 { margin: 0; font-size: 1.2em; padding-left: 0.5em; }
    
62. 
    
63. /*-----------------------------------------------------------------------------------布局*/
    
64. 
    . n# v/ Z. Y6 A6 Q, |4 F" m
65. .content { /*三列布局*/
    / [8 r# {: n- j- Y6 k- {* H
66.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y 0 0; }
    
67.         /*\*/ * html .content { height: 1%; } /**/ *>.content { overflow: hidden; }
    
68. .contentL { /*两列布局，侧边在左侧*/
    - [1 v  U$ }) L
69.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y -590px 0; }
    
70.         /*\*/ * html .contentR { height: 1%; } /**/ *>.contentR { overflow: hidden; }
    / X8 @/ a' ^0 s. d5 J7 l  V8 c
71. .contentR { /*两列布局，侧边在右侧*/
    
72.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y 580px 0; }
    
73.         /*\*/ * html .contentR { height: 1%; } /**/ *>.contentR { overflow: hidden; }
    
74. /*侧边样式*/
    
75. .sideL { width: 296px; float: left; overflow: hidden; }
    + s0 \& H  ^3 R1 E
76. .sideR { width: 202px; float: right; overflow: hidden; }
    
77. /*中间部分样式*/
    4 O" o4 h; d2 ]& ]! K
78. .mainarea { margin: 0 4px; width: 382px; float: left; }
    7 o+ E# E, A! b3 H6 }
79.         .contentL .mainarea { margin: 0 0 0 4px; width: 556px; }
    ( O  k! V+ a# U! M
80.         .contentR .mainarea { margin: 0 4px 0 0; width: 576px; }
    
81. 
    . d" Y3 X3 m- l3 l6 y8 E
82. /*-----------------------------------------------------------------------------------版块样式*/
    7 Z& h  b0 B/ `( [" {: \8 T! a9 z
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; }
    
88. 
    
89. /*头条信息*/
    + C# Z2 ]5 a' _4 H/ P6 `+ H" y
90. #headline { padding: 5px; height: 70px; he\ight: 58px; overflow: hidden; }
    " q, `% \7 p$ ~4 ~+ l
91.         #headline strong { font-size: 1.2em; }
    , w: l( T8 `3 b7 M
92.         #headline p { margin: 0.3em 0; }
    6 K; m, C! y# r2 `* ]. x
93.         #headline img { float: right; width: 48px; height: 48px; border: 4px solid #FFF; }
      N& L: ~( o; m; {2 ^
94. 
    
95. /*侧边版块*/
    
96. .sideblock { margin: 0 0 3px; border: 1px solid #86B9D6; background: #FFF; padding: 3px; }
    
97.         .boldblock { padding: 1px; background: #9FC8DF; } /*突出版块*/
    : m( Z& D  _: p; r0 u( H& e; g
98.         .cleanblock { border: 1px solid #86B9D6; margin: 0 0 4px; padding: 0; background: #F5FBFF; } /*简单版块*/
    , ^$ X! e# O9 O1 c
99.                 .sideblock h3 { margin: 0; font-size: 1em; line-height: 2em; padding-left: 0.5em; border-bottom: 1px solid #BBE9FF; }
    
100.                         /*\*/ * html .sideblock h3 { height: 1%; } /**/
     . I  h, N# o) m* b  A
101.                 .sideblock p { margin: 0.3em; line-height: 1.6em; }
     & e# c& n$ A  R
102.                         .headimg { float: right; margin: 5px 0 2px 5px; width: 80px; height: 80px; border: 4px solid #E2F0F9; }
     
103. 
     1 }: d) z0 g/ E: t9 Q( R! X
104.         /*侧边多行列表*/
     $ T9 d5 `1 J: V6 a
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; }
     * X& ?  [& n2 R$ g1 v
108.                 .sideblock dd { color: #999; margin-left: 0.8em; }
     6 {4 v9 I) S7 _/ w& y
109.                         .sideblock dd a { color: #999; }
     
110. 
     
111. /*单行信息列表*/
     * i+ A4 k8 s9 T2 x2 @. X
112. .msgtitlelist { margin: 0; padding: 5px 0; list-style: none; line-height: 1.6em; }
     5 Z2 B8 G5 K- S
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; }
       t8 C  \5 ?1 ]8 j8 w( V1 [
114.         .mainarea .msgtitlelist { font-size: 1.2em; }
     1 W4 f7 g; w5 b/ t2 H( W/ G3 C6 Q
115.         .sideblock .msgtitlelist { background: #FFF; }
     ( e& U9 a5 t- F# B" q& N3 z! v
116. 
     . D* Q5 W3 O1 v' ^4 k
117. /*多行信息列表*/
     ( |) s# ^0 y+ q6 ^* W" `
118. .messagelist { margin: 5px 0; padding: 0; list-style: none; line-height: 1.6em; }
     
119.         .messagelist li { margin: 5px 0 10px 0;}
     ! t' l& I$ e& v
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; }
     
123.                 .messagelist li p { margin: 0; }
     5 c2 r3 O& w; W( e0 K9 C% \
124. 
     , g( y8 F0 j7 g7 D
125.         .messagelist dl { margin: 0; padding: 0; line-height: 1.6em; }
     % C4 C7 n0 J3 I, ^+ @
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; }
     * K; {8 x1 I4 y8 X$ {
128.                         .messagelist dd a { color: #999; }
     4 L3 Z0 K- l, X+ c$ J! e2 f6 Y6 x
129. 
     
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; }
     
134.                 #hottag a { margin-right: 0.2em; white-space: nowrap; }
     9 `2 K- b* T, T9 Z
135.                         #hottag a em { color: #999; font-style: normal; }
     
136. 
     : J2 A) n: X, d8 G+ q4 k: w) Q
137. /*用户面板*/
     
138. #userpanel { height: 8.8em; overflow: hidden; }
     
139.         #userpanel form { margin: 5px auto !important; margin: 0 auto; width: 150px; }
     . \6 g- w' U. c: J+ I
140.                 #userpanel input { width: 90px; }
     / K. F' O, h/ D( n
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; }
     ( J( S- J. w  J
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; }
     0 `9 T& B4 [0 z; v8 P6 Y  t
147. 
     
148. /*空间之星*/
     0 s( E8 V. k- F% o+ c+ `$ K2 k
149. #spacestar ul { width: 168px; margin: 0 4px; padding: 0; height: 235px; }
     ! ~; `% J+ h1 X$ {6 r0 n
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; }
     
152.         #spacestar p { margin: -4px 0 !important; margin: 0 0; line-height: 20px; height: 20px; }
     
153. 
     : [4 G$ {6 f" T# s' G; B
154. /*同城空间*/
     
155. #cityspace { background: #F0F9FF; }
     
156. #cityspace form { width: 10.5em; margin: 0 auto; padding: 5px 0; }
     
157.         #cityspace select { margin: 2px 0; }
     6 r. |/ o. }) p' e; y. g- }
158.         #cityspace button { float: right; margin-top: 4px; width: 3.5em; height: 3.5em; }
     
159.         #blogblock #cityspace { margin: 0 0 4px 0; }
     5 i7 z7 a5 L1 P
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; }
     ! ]) c! t# T. B% }2 j  v
163.         #hotspace li { height: 20px; overflow: hidden; }
     
164.         #hotspace em { float: right; font-style: normal; font-size: 9px; color: #999; width: 40px; }
     $ z! D7 i3 F# I2 n
165. 
     
166. /*热门文章 */
     " R2 h, B' d! w8 \
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; }
     2 H- T: e/ F9 ^) b( y: B  A. Z
169.         #hotarticletabs { position: absolute; margin: 0; line-height: 18px; top: 7px!important; top: 8px; right: 10px; }
     # d+ ?6 v3 {6 c  R; z& d
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; }
     
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. 
     ) R+ _3 Z$ I( d! f
175. /*图片列表*/
     + B+ X6 |$ y7 [4 X/ {
176. .imgthumblist { margin: 0 3px; padding: 0; list-style: none; }
     " d; p7 ~! O4 I% g
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; }
     ' z+ A& S; p6 B& c; z7 r
179.                         .imgthumblist li.list1line { height: 123px; height: 115px; }
     1 {/ x0 _7 e* R, u- K$ ~
180.                         .imgthumblist li.list2line { height: 143px; height: 135px; }
     ; L* Q1 A+ g" O0 Y' _8 B$ T
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 j, X, f+ d/ v* d
184.         .throughgallery { width: 100%; clear: both; margin-bottom: 5px; padding-bottom: 3px; background: #E2F0F9; }
     
185.                 .throughgallery .imgthumblist { margin: 0; }
     / E+ O. z+ l# O9 C% S7 G
186.                 .throughgallery .imgthumblist li { height: 120px; margin: 3px 1px; }
     1 b4 o7 Q8 R4 k
187. 
     7 T8 N  C5 s# A2 C2 M; J: M  u
188. /*商品*/
     
189. /*\*/ * html .goodsthumblist { height: 1%; } /**/ *>.goodsthumblist { overflow: hidden; }
     
190.         .goodsthumblist { margin: 0; padding: 3px 0; list-style: none; }
     ; c4 z0 |3 U7 n+ M9 ~
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; }
     4 R8 c7 ^. D' e+ F7 u- W) r
193.                         .goodsthumblist li p { margin: -3px 0 0 !important; margin: 0; height: 1.5em; line-height 1.5em; overflow: hidden; }
     
194. 
     , [/ G3 S; }* S& V# f# x
195. .imgtitlelist { margin: 10px 0; padding: 0; list-style: none; }
     
196.                 .imgtitlelist li { padding-left: 85px; padding-bottom: 5px; margin: 5px 0; border-bottom: 1px solid #E2F0F9; }
     ( G8 {, j* ~8 Q5 M. Q
197.                 /*\*/ * html .imgtitlelist li { height: 1%; } /**/ .imgtitlelist>li { overflow: hidden; }
     ( Z1 w) h& a+ p9 ~3 r! @% v( l
198.                         .imgtitlelist li h4 { margin: 0.3em 0; font-size: 1em; }
     . [) M* u+ _2 s$ o
199.                         .imgtitlelist li img { float: left; margin-left: -85px; width: 70px; height: 70px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED; }
     
200.                         .imgtitlelist li p { margin: 0; line-height: 1.5em; }
     4 Z* u1 \; d6 X/ @% q
201.         .sideblock .imgtitlelist li { padding-left: 65px; }
     # r% Q' B& l7 ?
202.                 .sideblock .imgtitlelist li img { width: 48px; height: 48px; margin-left: -60px; }
     - U7 ^8 p# m; z( [1 M% u/ i- S
203.        
     " k; u1 b% ~0 c- {, U) {$ x% \9 q+ F
204. 
     
205. /*栏目区块列表*/
     + V# {% d$ Z/ C' A) }$ R0 |
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; }
     ; V( G& c# o! z5 S# }
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; }
     ' I4 M2 T6 D3 t* L% d5 j
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, x. f3 q& x7 x/ ?
213.                 .catecommend a { color: #000099; white-space: nowrap; margin-right: 0.5em; }
     3 K3 G% R$ |$ x: [, i  L( s+ w  _
214. 
     ' t, n: p( \% G  Y2 h
215. 
     
216. /*-----------------------------------------------------------------------------------首页各版块*/
     1 N' p- Z9 g: G, z1 z
217. 
     
218. /*#commendimage { height: 155px; }
     3 h# d, w4 {  x. W
219. #topicnews { height: 217px; }
       n! z. J+ x6 F
220. #newgoods, #commendgoods { height: 200px; }
     8 [. H2 C- V9 K0 T7 S0 S7 W( f3 R  W
221. #hotcommentfile, #hotfile, #newlink, #hotlink { height: 220px; }*/
     
222. 
     
223. 
     ' b- V  {! r  [% R# V
224. 
     
225. 
     
226. /*信息列表*/
     
227. .articlelist li { padding-left: 60px; }
     3 D# @5 g& ?/ F. p: S9 F# X9 O
228.         .articlelist h4 img { float: left; margin-left: -60px; width: 48px; height: 48px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED; }
     5 D- [# I; Y( ?) r! b
229. /*.articlelist  h3 a { font-size: 12px; font-weight: normal; margin-left: 1em; color: #B353B3; }
     
230.        
     1 w# t$ R. ^+ B
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; }
     
236.                 .articlelist li img { position: absolute; left: 0!important; left: -67px; top: 0; border: 3px solid #9FC8DF; width: 48px; height: 48px; }
     6 K9 K5 H$ A" P9 `* Q
237.                
     
238.                 .articlelist li strong { font-weight: normal; color: #999; line-height: 2em; padding-left: 0.5em; }
     6 O: t4 z/ w: ]( ]3 T* w
239.                         .articlelist li strong a { color: #999; }
     # Z7 R% Z/ F" \5 T, p% |- d0 l. G0 N
240.                 .articlelist li p { margin: 0.3em 0; line-height: 1.6em; }
     8 z, l# E4 f) E+ }/ o" S7 r4 j; O; U+ J
241.                         .articlelist li p a.more { float: none !important; }*/
     ' E: q8 [) F1 c0 J+ S
242. 
     
243. 
     # b% b; J1 y# x5 W
244. .catepic { text-align: center; }
     
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; }
     : @9 j( c) b6 a5 X8 l( ?" |% P
248. 
     2 ?- o6 k/ r7 V: Z
249. /*专题列表*/
     
250. #subjectlist { border-color: #86B9D6; padding: 2px; }
     
251.         #subjectlist h3 { border: none; background: #9FC8DF; }
     + e' E! F5 C/ L
252.         #subjectlist li { border-bottom: 1px solid #E2F0F9; text-align: center; padding: 3px; }
     
253.                 #subjectlist p { margin: 0; line-height: 1.2em; }
     4 _/ Q) H& K3 W& B
254. 
     / j( q6 Y! V* ~! _# y  r
255. 
     
256.         #xspace-rates { height: 2em; }
     
257.                 #xspace-rates label { float: left; line-height: 24px; margin-right: 5px; }
     3 B( ]  }: K4 _' O
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; }
     % v/ K- ?  ~; d& D, P1 L$ E) F% I
261. 
     
262. 
     0 p! z6 @4 ~7 o& d
263. #panel { width: 600px; overflow: hidden; margin: 1em auto; }
     , i: q+ s& E; P, ?0 S8 f
264. 
     
265. 
     : P9 ?' u2 f2 L9 K) b
266. /*Pages*/
     5 f4 z3 w; l% Z. j  }0 \( L: \
267. .pages { text-align: right; border-top: 1px solid #9FC8DF; }
     ; q6 l3 p/ [# A
268.         /*.pages table { margin: 3px 0 3px auto; text-align: center; }
     4 E$ u) ^/ o' w) R
269.                 .pages td { padding: 0 5px; border: 1px solid #B9D0ED; background: #FFF; }
     . J9 B$ e2 c3 F, M5 E
270.                 .pages a { text-decoration: none; }
     
271.                 .pages .currentpage { background: #F0F9FF; border-color: #86B9D6; font-weight: bold; }*/
     
272. 
     " D" Z3 B$ I7 O" Z0 V0 y
273. /* 分页 */
     ; }# w" G2 M5 y6 c* Z6 D) p
274. .xspace-page { margin: 2px 2px 2px auto; }
     , Z1 s" S" G! a: ~* x
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; }
     - |: f" f# D3 @" z
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; }
     5 _% h# |  p* ?- E# O' e: ?
281.         .smalltxt a, .smalltxt a:visited { color: #999 !important; }
     
282. 
     & s  w* \1 V" q- L3 A. e
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; }
     1 m+ U# s- ], b! K
285.         #footer p { margin: 0.3em 0; color: #999; }
     
286.         #footer strong { color: #007AB6; }
     $ V; L+ n" T# N0 R0 D; ~
287.         #footer em { font-style: normal; font-weight: bold; color: #96A800; }
     - D% J, Q+ F, X) V3 n
288.        
     9 G: ]$ R' q" L' w
289. .imglogolist { margin: 0; padding: 0; list-style: none; text-align: center; }
     + T& x; l  I/ g3 |+ o
290.        
     ( `; X4 P% Q( |; o% j6 C, S
291. #articledetail { border: 1px solid #86B9D6; text-align: center; }
     . [) J' m: a% S- `
292. .articletitle { font-size: 1.6em; margin: 1em 0 0.5em; }
     
293. .articleinfo { border-bottom: 1px solid #9FC8DF; margin: 0;}
     
294. .articlectrl { margin: 0.5em 0 1.5em; }
     , z% Y. L; W% E6 ^0 F
295. 
     
296.         #articlebody { width: 98%; margin: 0 auto; overflow: hidden; text-align: left; overflow-y: hidden; line-height: 1.8em; font-size: 1.2em; }
     6 l& c- R2 p7 S/ p6 E6 Y8 q
297.         #articlebody * { line-height: normal; }
     / v" x2 i1 y8 ?" L  I" f
298.                 #articlebody  p, #articlebody  div { line-height: 1.8em !important; margin: 10px 0; }
     & D) S3 y, n  o* P% B2 @0 t
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; }
     
303.                 #articlebody .addoninfo ul { margin: 0.5em 0 0.5em 2em; padding: 0; }
     " h2 P, [: Z: }# a  q( n
304.                         #articlebody .addoninfo li { line-height: 1.6em !important; }
     2 T, e+ K9 P: b3 q, H1 u, Y
305.        
     
306.         #articlebody img { width: expression(this.width > 500 ? 500: true); max-width: 500px;  }
     
307.        
     ' p1 j$ }% ?5 G; 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; }
     
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; }
     / B% U7 y( `& m6 H. F
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. 
     
317. /*发表评论*/
     
318. #comment { margin-top: 4px; }
     
319.         #comment h3 { margin: 0 5px; font-size: 1em; line-height: 2em; }
     
320.         #comment form { background: #FFF; margin: 0; padding: 5px; }
     
321.         #comment p { margin: 0.3em 0; }
     
322.         .seccodeline * { vertical-align: middle; }
     
323.         #xspace-rates { height: 2em; }
     $ K- D4 W( Q$ p9 y
324.                 #xspace-rates label { float: left; line-height: 24px; margin-right: 5px; }
     ; N! E. \( @8 }% K3 D+ R
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; }
     
328. 
     
329. /*AJAX div*/
     & u5 D( o5 o- g5 v9 P
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; }
     2 z+ q% l) }3 ]* F. t: C
332.                 .xspace-ajaxdiv h5 a { float: right; font-weight: normal; }
     ! r: |6 }1 y/ a7 X7 v
333.         .xspace-ajaxcontent { background: #FFF; border: 1px solid #EEE; }
     + W. w4 d% K. K! X" ]4 Q3 e' X
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; }
   " D  [1 n) F5 @5 t2 V* V
4. #wrap { background: #FFF; margin: 0 auto; text-align: left; width: 910px; padding: 0 4px; w\idth: 910px; }
   
5. 
   

复制代码

分析

5 P* e. z: O* q& R: r4 [  o" c) L

1. margin属性说明：
   
2. 
   8 H' F& H7 M) t' k) ?
3. 检索或设置对象四边的外延边距。
   ( a! Q3 T, b: k, q9 Z" ]) R& n* t3 E
4. 如果提供全部四个参数值，将按上－右－下－左的顺序作用于四边。
   $ F% \$ B0 A, U- {/ a% J7 u6 F
5. 如果只提供一个，将用于全部的四边。
   * x. W% G) k0 Y& k- G' E! }
6. 如果提供两个，第一个用于上－下，第二个用于左－右。
   
7. 如果提供三个，第一个用于上，第二个用于左－右，第三个用于下。
   ' O0 B' v% F( q7 ?$ c& n& A
8. 内联对象要使用该属性，必须先设定对象的height或width属性，或者设定position属性为absolute。
   
9. 在IE4+，margin属性不可用于td和tr对象。
   
10. 外延边距始终透明。
    
11. 
    & u& r- E, s4 y+ d+ ]8 W+ i
12. color : 　指定颜色
    * U6 _# Z6 B: X: B; z
13. text-align:文本的对齐方式。(left : 　左对齐,right : 　右对齐,center : 　居中,justify : 　两端对齐)
    
14. font: 12px Arial, Helvetica, sans-serif;  :这段是字体相关的
    7 t# Q* T4 v9 |) B
15. 
    3 _+ C/ M, R0 {  {0 x6 x1 Y+ L% n4 p
16. 
    

复制代码

傲天♂浪子追风

1. /*链接样式*/
   
2. a { color: #000; text-decoration: none; }
   
3.         a:hover { text-decoration: underline; color: #000098; }
   $ j# _8 s  W7 M
4.                 a:visited { color: #666;}
   + _" n: k' M% [3 W+ P& M8 m9 e
5.         #topmenu a, #menu a, .imglist a, #hotspace li a { text-decoration: none; }
   
6.                 #topmenu a:hover, #menu a:hover, .imglist a:hover, #hotspace li a:hover { text-decoration: underline; }
   
7.         a img { border: none; }
   1 v5 ^* U9 ~$ y& C' O
8. li cite { font-style: normal; font-size: 12px; float: right; width: 4em; color: #999; }
   + H: ?* |  X# i/ j9 c
9.         li cite a { color: #999; }
   ! K" r2 a+ U& B* P; h$ d4 R
10.                 li cite a:visited { color: #999; }
    4 T! h; O1 n- m" Z$ n  X, q
11. .more { float: right !important; color: #000098 !important; background: transparent !important; font-size: 12px !important; font-weight: normal !important; cursor: pointer; }
    
12. 
    

复制代码

3 d7 |- o' v$ q( X
3 J) D; F. E) Z+ u分析

1. 
   
2. text-decoration:文本连接的属性,一般有以下几种参数:
   & p: t4 H. f+ w
3. none : 　无装饰
   
4. blink : 　闪烁
   5 Z2 t+ J  I4 [* S
5. underline : 　下划线
   * }% t: V: l1 d- _' h
6. line-through : 　贯穿线
   5 a2 |- H" e5 x1 c* Y0 D8 B% K! I8 q
7. overline : 　上划线
   
8. 
   5 r2 \8 \% n+ x7 T" W) F6 W
9. 
   
10. hover:设置对象在其鼠标悬停时的样式表属性。
    % i5 g5 G* s  A: c/ o. ?1 ~
11. 
    7 B3 d3 d' ]" c8 N
12. visited:对象在其链接地址已被访问过时的样式表属性。
    6 P# S) k1 j8 `6 p
13. 
    1 g2 a/ H  R1 v9 D6 U+ X
14. #topmenu a, #menu a, .imglist a, #hotspace li a { text-decoration: none; }
    8 U. }1 s+ s9 k' e
15. #topmenu a:hover, #menu a:hover, .imglist a:hover, #hotspace li a:hover { text-decoration: underline; }:
    
16. 上面这两行是与鼠标相关
    
17. 
    * X) S; d  {8 I% G- M, `6 C- _
18. a img { border: none; }图片连接相关
    
19. 
    ! p' j- |) F* m. k) J% t; D
20. 
    , {9 H% }; B3 E
21. cite:这个一般是引用标签的时候用的,不知道用来这里做什么
    1 Z! }/ v. ?3 Z: T; U9 ~+ o
22. 
    
23. 
    9 ~  @1 H' P- _) M+ h; d
24. font-style:字体式样,一般常用参数有:
    
25. normal : 正常的字体
    ! R2 C8 J9 k( ]( n# Y: v! b9 G1 m$ ^
26. italic : 斜体。对于没有斜体变量的特殊字体，将应用oblique
    7 `* M, V/ t/ C* }+ ^
27. oblique : 倾斜的字体
    : `! g" C5 ~7 Y4 a# Z" O# d8 Z
28. 
    + k( z! r% ^' `! J6 [( d
29. 
    2 j. u" J5 M( m+ S$ B( F  ^
30. float: right 该属性的值指出了对象是否浮动及如何浮动。常用参数如下:
    5 o; R% c, N9 [0 Z6 |
31. none : 　对象不浮动
    & k  G9 q. y, ~: g
32. left : 　对象浮在左边
    
33. right : 　对象浮在右边
    " m) t8 _- B' a2 }- \. O/ F% w
34. 
    # a1 \9 P' e9 l9 e3 [
35. 
    4 ~1 k' h. z) t3 P: f
36. important:样式表条目,提升指定样式规则的应用优先权。
    - J# D! [8 q' o3 e! j% M
37. 
    " `. S: T6 l( H
38. 
    : f( `0 p& n% F+ u' u
39. background: transparent 这个的意思就是背景透明...
    
40. 
    8 q, L! t2 E- r& Z
41. 
    
42. 
    ) G0 _/ ^: e4 y' O' o
43. font-weight: normal :文本字体的粗细,常用参数如下:
    
44. normal : 正常的字体。相当于number为400。声明此值将取消之前任何设置
    
45. bold : 粗体。相当于number为700。也相当于b对象的作用
    ; f& z! [6 H% x5 N. t: f/ \/ g
46. bolder : IE5+　特粗体
    
47. lighter : IE5+　细体
    
48. number : IE5+　100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
    , [0 X/ ^$ {7 e- H
49. 
    1 Y2 |' L- K) r
50. cursor: pointer:这个是鼠标放在对象中的状态,简单点来可以这样说,也就是鼠标放在连接上的时候显示的鼠标形状,一般有以下N种参数,这个真的是TMD的多啊
    
51. 语法：(每一竖隔开为一个状态)
    - V! g6 w% W. Z/ |* g$ r
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. 
    ( P7 o0 v+ Q# `4 w1 g; z
57. 
    ! j2 S0 [; z  L; {- C
58. 
    
59. 
    ; R5 E$ \! _+ M# ^

复制代码

傲天♂浪子追风

1. /*-----------------------------------------------------------------------------------表单通用样式*/
   , L$ `! C" l. k
2. 
   - k# i& h# M. E: j" j! O
3. form { margin: 0; }
   
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; }
   " G" ]: g& @; A8 m
7.         fieldset { border: 0; padding: 0; }
   
8.                 legend { display: none; }
   + A; O3 W6 v, D7 e, e
9.         label { cursor: pointer; margin-right: 0.5em; }
   ! B1 l+ h* v+ B' _3 y

复制代码

bronwen

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

傲天♂浪子追风

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

傲天♂疯紫

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