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

傲天♂浪子追风

1. * { word-break: break-all; } /*在IE中实行强制换行*/
   & X( s; R* f* L- M
2. #newsblock { margin-top: 4px; }
   % J2 K7 l3 h. @8 b; _) Z& ?
3. /*-----------------------------------------------------------------------------------综合设置*/
   
4. 
   7 i- S' o5 R4 u
5. body { margin: 0; background: #FFF; color: #333; text-align: center; font: 12px Arial, Helvetica, sans-serif; }
   
6. #wrap { background: #FFF; margin: 0 auto; text-align: left; width: 910px; padding: 0 4px; w\idth: 910px; }
   % L" w+ |0 d: D
7. 
   
8. /*链接样式*/
   ; f& L& a6 G- R7 H2 N% C
9. a { color: #000; text-decoration: none; }
   ; v* Q8 w. Q9 W% M0 j( o" r- ?" Z3 o- U
10.         a:hover { text-decoration: underline; color: #000098; }
    1 p% X: f! G# x! \  |4 W
11.                 a:visited { color: #666;}
    6 W: y( ^2 x8 o* w
12.         #topmenu a, #menu a, .imglist a, #hotspace li a { text-decoration: none; }
    % h* g7 \+ |6 B: ^$ L& J$ q
13.                 #topmenu a:hover, #menu a:hover, .imglist a:hover, #hotspace li a:hover { text-decoration: underline; }
    6 X! _6 w$ }4 \2 J" `
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; }
    
18. .more { float: right !important; color: #000098 !important; background: transparent !important; font-size: 12px !important; font-weight: normal !important; cursor: pointer; }
    0 B4 O( r+ d/ \4 U
19. 
    
20. /*-----------------------------------------------------------------------------------表单通用样式*/
    ; [% t" A1 K$ _' \6 M3 u
21. 
    / {0 C7 K# O  c
22. form { margin: 0; }
    ! `7 y; V2 S. n
23.         input, textarea, button, select { font: 1em Arial, Helvetica, sans-serif; }
      C3 `2 M% G. E) G1 e5 |1 z# f
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; }
    
28.         label { cursor: pointer; margin-right: 0.5em; }
    
29. 
    4 d* D4 W& c) }3 ~
30. /*-----------------------------------------------------------------------------------头部风格 Header*/
    
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; }
    
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; }
    . W1 I- G- S8 J4 z; O5 H
36. 
    5 v* A! [( f+ }# x* i2 O. V
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; }
    # ~, j* Y+ E" M7 G8 f$ l; m. s
39.         .banner468 { float: right; }
    . @2 ?2 I* T9 e/ [" |9 ^
40. 
    
41. /*主导航*/
    - [  o" l; z! S& G
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; }
    9 l* _( D) G1 M/ ~
43.         #menu ul { list-style: none; margin: 0 1em; padding: 0; width: 100%; overflow: hidden; }
    
44.                 #menu li { float: left; margin: 0 2px; width: 6em; overflow: hidden; white-space: nowrap; }
    
45.         /*首页导航*/
    , ]$ F* t$ j0 \- g# e' Q
46.         #menu dl { margin: 0 1.5em; padding: 0; height: 25px; overflow: hidden; }
    
47.                 #menu dt { float: left; width: 4em; white-space: nowrap; }
    / U5 s) u" m7 x' u8 O: N7 f
48.                         #menu dt a { color: #000098 !important; }
    ' O" x$ s5 b; k5 M5 `( Q& C( ^
49.                 #menu dd { float: left; width: 6em; margin: 0 2px; overflow: hidden; white-space: nowrap; }
    
50. 
    ) M/ Y5 r& C+ g3 Y% }# G7 Y
51. /*您的位置导航*/
    # g% h# q% P3 r- \/ C! c- u
52. #navigation { padding: 1.2em 0; }
    
53.         #navigation p { margin: 0;}
    
54.                 #navigation p a, #navigation p strong { margin: 0 0.5em; }
    7 |1 c# g- ^6 J0 n$ P
55.         #searchform { float: right; }
    . ?. s! ?) |5 o# ~
56.                 #searchform * { vertical-align: top; }
    
57.                 #searchform button { margin-left: 0.5em; }
    # E) a  h& z+ [% N) a" j; |
58. 
    , W3 P4 T* d" g$ G& M* ~' H* P
59.         #navigation.simplepage { padding: 0; border-top: 2px solid #009DEA; border-bottom: 1px solid #009DEA; line-height: 25px; background: #EFF5FF; margin-bottom: 1em; }
    
60.                 #navigation.simplepage p { float: right; margin-right: 0.5em; }
    : L1 V0 S1 h) e- O3 O: c
61.                 .simplepage h2 { margin: 0; font-size: 1.2em; padding-left: 0.5em; }
    
62. 
    
63. /*-----------------------------------------------------------------------------------布局*/
    0 Y4 \4 d2 s; y$ G" f# A1 `. F
64. 
    
65. .content { /*三列布局*/
    ! v- ^) V0 [0 t0 i  t$ K+ A
66.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y 0 0; }
    % J# u  ?9 k7 x" Y$ f' n
67.         /*\*/ * html .content { height: 1%; } /**/ *>.content { overflow: hidden; }
    
68. .contentL { /*两列布局，侧边在左侧*/
    
69.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y -590px 0; }
    1 I7 W' ~5 O9 S+ c
70.         /*\*/ * html .contentR { height: 1%; } /**/ *>.contentR { overflow: hidden; }
    
71. .contentR { /*两列布局，侧边在右侧*/
    
72.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y 580px 0; }
    9 |) G3 y; S  J, R- g
73.         /*\*/ * html .contentR { height: 1%; } /**/ *>.contentR { overflow: hidden; }
    
74. /*侧边样式*/
    
75. .sideL { width: 296px; float: left; overflow: hidden; }
    6 u3 v( S! B; [/ T
76. .sideR { width: 202px; float: right; overflow: hidden; }
      J: c( e2 ?/ b' {4 E
77. /*中间部分样式*/
    ! n; \2 M$ P, f
78. .mainarea { margin: 0 4px; width: 382px; float: left; }
    
79.         .contentL .mainarea { margin: 0 0 0 4px; width: 556px; }
    " C+ Z1 t  h6 v/ P5 c
80.         .contentR .mainarea { margin: 0 4px 0 0; width: 576px; }
    
81. 
    
82. /*-----------------------------------------------------------------------------------版块样式*/
    : R/ A1 `: n! k* v) u
83. 
    
84. /*版块标题*/
    
85. .blocktitle { clear: both; border: 1px solid #86B9D6; padding: 1px; margin-bottom: 4px; line-height: 30px; }
    * C' p& a' |7 e* N0 ~4 y- `* b
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; }
    4 ~+ e: K. U0 E6 i3 [% m
88. 
    
89. /*头条信息*/
    - u1 O/ y% H. G# f! ]: I3 `+ j
90. #headline { padding: 5px; height: 70px; he\ight: 58px; overflow: hidden; }
    : g; v! s  w3 M
91.         #headline strong { font-size: 1.2em; }
    
92.         #headline p { margin: 0.3em 0; }
    ( \; G2 S" \9 {7 u! H' }
93.         #headline img { float: right; width: 48px; height: 48px; border: 4px solid #FFF; }
    
94. 
    " r9 J! F+ f- ~4 w+ m
95. /*侧边版块*/
    % E: `. R: c; z4 A
96. .sideblock { margin: 0 0 3px; border: 1px solid #86B9D6; background: #FFF; padding: 3px; }
    , m  R& [4 D7 K+ {
97.         .boldblock { padding: 1px; background: #9FC8DF; } /*突出版块*/
    , p7 u( @7 r8 W' N3 f. e  g
98.         .cleanblock { border: 1px solid #86B9D6; margin: 0 0 4px; padding: 0; background: #F5FBFF; } /*简单版块*/
    ) H! F* [6 v9 n6 Q4 h# `: H% G
99.                 .sideblock h3 { margin: 0; font-size: 1em; line-height: 2em; padding-left: 0.5em; border-bottom: 1px solid #BBE9FF; }
    : h# _& u) s, V* ^) M  N5 a4 D
100.                         /*\*/ * html .sideblock h3 { height: 1%; } /**/
     
101.                 .sideblock p { margin: 0.3em; line-height: 1.6em; }
     9 n" b9 E# z* r  t+ c3 e/ |2 t' i
102.                         .headimg { float: right; margin: 5px 0 2px 5px; width: 80px; height: 80px; border: 4px solid #E2F0F9; }
     
103. 
     
104.         /*侧边多行列表*/
     # ~: O- I2 x' ^2 `- G
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; }
     
108.                 .sideblock dd { color: #999; margin-left: 0.8em; }
     / \( J- f% ^0 M
109.                         .sideblock dd a { color: #999; }
     " j: z  t- J& T6 E
110. 
     
111. /*单行信息列表*/
     , N) R1 r2 B& \) s/ M' D
112. .msgtitlelist { margin: 0; padding: 5px 0; list-style: none; line-height: 1.6em; }
     1 R8 \0 y* a% p( y7 P" Q; ]3 ?
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; }
     ( j8 y2 @  w+ K( z0 B
115.         .sideblock .msgtitlelist { background: #FFF; }
     + u5 \4 A! O! @6 ?5 i# s
116. 
     ! V. a8 m' J4 j$ W7 [# F
117. /*多行信息列表*/
     : _; x9 n* ~% _* F. G9 _( g
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 M# V  ^3 [
122.                                 .messagelist li h4 a:visited { font-weight: normal; }
     / U) \5 t( Y/ @2 q& H) @
123.                 .messagelist li p { margin: 0; }
     % b( E6 `4 g* C9 ?1 \7 f
124. 
     
125.         .messagelist dl { margin: 0; padding: 0; line-height: 1.6em; }
     
126.                 .messagelist dt { background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.7em; padding-left: 0.8em; }
     
127.                 .messagelist dd { font-size: 12px; margin: 0; padding-left: 1em; color: #999; }
     " }" G# M+ Q# P
128.                         .messagelist dd a { color: #999; }
     ; i- w: W1 f) N- w/ m0 \2 W
129. 
     
130. /*热门话题*/
     & X! v# n1 }, a
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; }
     ' a; z1 b/ C4 p; F  }$ o9 y0 q0 @
135.                         #hottag a em { color: #999; font-style: normal; }
     4 i" ?" t: N# Q5 t- o+ U
136. 
     
137. /*用户面板*/
     / R* a$ z% ?0 a7 ?1 Z1 w- n
138. #userpanel { height: 8.8em; overflow: hidden; }
     
139.         #userpanel form { margin: 5px auto !important; margin: 0 auto; width: 150px; }
     
140.                 #userpanel input { width: 90px; }
     ' A, o* C- J. A8 W. O+ d5 u* 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; }
     + k: {9 S6 P8 Y& k* Q
144.         /*登录后*/
     ) [- B1 S2 i7 e. 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; }
     3 `, D* r2 X4 C; g
146.                 #userpanel li a { color: #000098; }
     / I$ s9 V3 Y6 D: N) A7 K
147. 
     
148. /*空间之星*/
     4 R) ^, h$ S  i+ h3 N1 z# f2 r
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; }
     
152.         #spacestar p { margin: -4px 0 !important; margin: 0 0; line-height: 20px; height: 20px; }
     9 g8 ?3 E: n. L- ^0 m4 F
153. 
     5 A1 k9 m( z5 R* V9 r; `
154. /*同城空间*/
     + O! d% p" [% p2 N7 E4 i
155. #cityspace { background: #F0F9FF; }
     5 Y, H: e2 ~8 v5 R% K
156. #cityspace form { width: 10.5em; margin: 0 auto; padding: 5px 0; }
     3 t% D/ \! n9 i$ ^2 S
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. 
     0 x3 @, [& n! Y8 A
161. /*空间排行*/
     " S8 f5 t+ B/ }' g+ k) Y
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; }
     * {+ X3 t$ \9 m; B$ g
164.         #hotspace em { float: right; font-style: normal; font-size: 9px; color: #999; width: 40px; }
     ) v6 _- p# |, r
165. 
     
166. /*热门文章 */
     
167. #hotarticle { border: 1px solid #86B9D6; background: #E2F0F9; padding: 3px; position: relative; }
     
168.         #hotarticle h3 { font-size: 1.2em; margin: 0; line-height: 22px; border-bottom: 1px solid #86B9D6; }
     " ~) C. r9 M. N( X
169.         #hotarticletabs { position: absolute; margin: 0; line-height: 18px; top: 7px!important; top: 8px; right: 10px; }
     " Y0 w5 H2 E4 V. W3 f% s7 a
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. 
     1 H; r% v3 r" |
175. /*图片列表*/
     
176. .imgthumblist { margin: 0 3px; padding: 0; list-style: none; }
     ! `: T& U. m) z5 X
177.         /*\*/ * html .imgthumblist { height: 1%; }/**/ *>.imgthumblist { overflow: hidden; }
     7 d4 i, f2 H3 {0 o4 k" F# W
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; }
     " b3 P. D! W9 ^+ F, A6 `
179.                         .imgthumblist li.list1line { height: 123px; height: 115px; }
     
180.                         .imgthumblist li.list2line { height: 143px; height: 135px; }
     1 C# L' |) Y: l7 @9 j. R
181.                         .contentL .imgthumblist li { margin: 0 1px 3px; }
     
182.                         .imgthumblist img { width: 100px; height: 100px; }
     ! y* Y+ n' `/ t. j
183.                         .imgthumblist p { margin: 0; text-align: center; line-height: 1.3em; }
     
184.         .throughgallery { width: 100%; clear: both; margin-bottom: 5px; padding-bottom: 3px; background: #E2F0F9; }
     
185.                 .throughgallery .imgthumblist { margin: 0; }
     . c/ ?: _$ _4 t! o4 l8 D
186.                 .throughgallery .imgthumblist li { height: 120px; margin: 3px 1px; }
     3 S! s, n& z. D8 E; D) W8 E; y  g
187. 
     
188. /*商品*/
     
189. /*\*/ * html .goodsthumblist { height: 1%; } /**/ *>.goodsthumblist { overflow: hidden; }
     1 q; V6 s$ D" L- H  W0 V2 ~
190.         .goodsthumblist { margin: 0; padding: 3px 0; list-style: none; }
     
191.                 .goodsthumblist li { float: left; width: 90px; height: 100px; text-align: center; }
     7 D' F5 U  T5 A4 Q8 u
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. 
     / B6 c! M1 x" o! l1 M, m
195. .imgtitlelist { margin: 10px 0; padding: 0; list-style: none; }
       t6 E8 T4 m. B) T, w/ t* H$ K
196.                 .imgtitlelist li { padding-left: 85px; padding-bottom: 5px; margin: 5px 0; border-bottom: 1px solid #E2F0F9; }
     6 R/ d( K  O" V8 Y6 f, d1 \
197.                 /*\*/ * html .imgtitlelist li { height: 1%; } /**/ .imgtitlelist>li { overflow: hidden; }
     
198.                         .imgtitlelist li h4 { margin: 0.3em 0; font-size: 1em; }
     
199.                         .imgtitlelist li img { float: left; margin-left: -85px; width: 70px; height: 70px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED; }
     & v+ v' i/ p4 M; @7 i. W
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; }
     6 J! L) n7 Z, |3 G3 v8 W
203.        
     4 t8 N0 t0 H: [& X! |7 `) J
204. 
     / ?9 @6 W4 x2 [- ?. t7 E
205. /*栏目区块列表*/
     " }% n( y. z. @
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; }
     # U; R% u7 p: l4 @5 _& q/ I
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; }
     , z/ m$ u8 M7 w& d5 ?
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; }*/
     2 k' y' |) A/ B0 y  o# T* A
213.                 .catecommend a { color: #000099; white-space: nowrap; margin-right: 0.5em; }
     " t6 L- z3 T+ ~$ o: J( G
214. 
     
215. 
     ! T9 ~4 r. i' t; B( y0 ~
216. /*-----------------------------------------------------------------------------------首页各版块*/
     * y, b) O9 H& ^/ r0 O$ n
217. 
     
218. /*#commendimage { height: 155px; }
     
219. #topicnews { height: 217px; }
     
220. #newgoods, #commendgoods { height: 200px; }
     - h9 J4 e7 i8 P+ O! R
221. #hotcommentfile, #hotfile, #newlink, #hotlink { height: 220px; }*/
     
222. 
     6 j, d, M9 q4 c! d& |9 c/ Q: X
223. 
     ! O; A4 B7 m" P2 U. w' V2 L4 |) l6 ]
224. 
     
225. 
     
226. /*信息列表*/
     ; s' F' d/ @2 U8 Y" g, S2 c
227. .articlelist li { padding-left: 60px; }
     # f$ H7 [2 C+ `0 D- O6 o
228.         .articlelist h4 img { float: left; margin-left: -60px; width: 48px; height: 48px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED; }
     , d, L: _+ g- I1 |6 `5 d$ @6 g
229. /*.articlelist  h3 a { font-size: 12px; font-weight: normal; margin-left: 1em; color: #B353B3; }
     & ?- ~  M" D  _
230.        
     . I" R, h4 y3 F2 G2 _% {3 v
231.         .articlelist ul { margin: 0; padding: 0; background: #FFF; padding-left: 5px; list-style: none; }
     
232.                 .articlelist li { position: relative; padding-left: 60px; margin-top: 1em; }
     
233.         .articlelist h4 { margin: 0; background: #F0F9FF; font-size: 1.2em; padding: 0.2em 0.5em; cursor: pointer; }
     
234.                 .articlelist h4 em { font-style: normal; font-weight: normal; font-size: 0.8em; color: #B353B3; margin-left: 0.3em; }
     3 |3 |9 T/ P4 f
235.                 .articlelist h4 a { color: #000099; }
     - P; v6 _! x! L/ S
236.                 .articlelist li img { position: absolute; left: 0!important; left: -67px; top: 0; border: 3px solid #9FC8DF; width: 48px; height: 48px; }
     
237.                
     : {2 _) [1 V' J8 ?
238.                 .articlelist li strong { font-weight: normal; color: #999; line-height: 2em; padding-left: 0.5em; }
     & h, w1 w& u( u
239.                         .articlelist li strong a { color: #999; }
     ' I. B% H1 d. V, z
240.                 .articlelist li p { margin: 0.3em 0; line-height: 1.6em; }
     8 M' S9 x3 f& W. s
241.                         .articlelist li p a.more { float: none !important; }*/
     ) Q; {( x" o2 V; K8 ~* T
242. 
     
243. 
     
244. .catepic { text-align: center; }
     ; a6 b0 O/ g+ v7 b
245.         .catepic img { margin-top: 10px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED;
     ( Z8 u  [) \3 @  g3 Q8 a
246.                 max-width: 150px; max-height: 150px; width: expression(this.width > 150 ? 150: true); height: expression(this.height > 150 ? 150: true); }
     4 N' ^# Q+ @1 ?( \1 a
247.         .catepic p { text-align: left; margin: 0.5em; }
     : W* T7 t" u. z- {
248. 
     ' g# c+ _/ _  n, ^7 i
249. /*专题列表*/
     6 {3 P, [0 M9 y2 Z9 w
250. #subjectlist { border-color: #86B9D6; padding: 2px; }
     : q3 a5 W9 t* e
251.         #subjectlist h3 { border: none; background: #9FC8DF; }
     
252.         #subjectlist li { border-bottom: 1px solid #E2F0F9; text-align: center; padding: 3px; }
     & ~" p4 u; V! ?. E; K2 S
253.                 #subjectlist p { margin: 0; line-height: 1.2em; }
     
254. 
     
255. 
     ; x5 ?4 b7 s+ G9 E0 l6 T
256.         #xspace-rates { height: 2em; }
     
257.                 #xspace-rates label { float: left; line-height: 24px; margin-right: 5px; }
     
258.                 #xspace-rates a { float: left; border: 1px solid #EEE; text-decoration: none; width: 20px; height: 20px; text-align: center; line-height: 20px; margin: 0 2px; }
     : v! e, I, H- y/ H, l3 D- }# S
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; }
     $ c' ^/ V9 }& Q- |6 \
261. 
     
262. 
     . \1 n; p1 Q$ @# ~. I
263. #panel { width: 600px; overflow: hidden; margin: 1em auto; }
     ' S6 u2 C- h! \5 ]+ }) G( e& W( d
264. 
     " d2 H3 B' {7 w8 ^
265. 
     * ?3 h% s% L& V$ p: b0 t" r5 y7 `4 I
266. /*Pages*/
     / b. @& }5 G% c6 r$ z
267. .pages { text-align: right; border-top: 1px solid #9FC8DF; }
     
268.         /*.pages table { margin: 3px 0 3px auto; text-align: center; }
     3 w  c6 v, J; b4 O2 n
269.                 .pages td { padding: 0 5px; border: 1px solid #B9D0ED; background: #FFF; }
     
270.                 .pages a { text-decoration: none; }
     & F& m% z# ]' M
271.                 .pages .currentpage { background: #F0F9FF; border-color: #86B9D6; font-weight: bold; }*/
     
272. 
     
273. /* 分页 */
     ; \! P+ u# [+ ~. D9 G
274. .xspace-page { margin: 2px 2px 2px auto; }
     4 L  y7 n: A) 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; }
     # }9 j  d9 N  A% J. i, m' x
277.         table.xspace-page td.xspace-current { background: #86B9D6; padding: 0.3em 0.5em; font-weight: bold; }
     / D! K) Z) P4 s1 {7 i7 k
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; }
     
281.         .smalltxt a, .smalltxt a:visited { color: #999 !important; }
     5 K. v. B. l2 v# [
282. 
     
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; }
     ) M9 b5 S! E6 o# B/ g
285.         #footer p { margin: 0.3em 0; color: #999; }
     3 _7 B7 s5 z5 m1 h( G" [6 @
286.         #footer strong { color: #007AB6; }
     
287.         #footer em { font-style: normal; font-weight: bold; color: #96A800; }
     * {9 E) x# d: \+ c
288.        
     
289. .imglogolist { margin: 0; padding: 0; list-style: none; text-align: center; }
     
290.        
     
291. #articledetail { border: 1px solid #86B9D6; text-align: center; }
     
292. .articletitle { font-size: 1.6em; margin: 1em 0 0.5em; }
     
293. .articleinfo { border-bottom: 1px solid #9FC8DF; margin: 0;}
     / U9 u  J* S- v& J7 E
294. .articlectrl { margin: 0.5em 0 1.5em; }
     
295. 
     : `2 [6 ^1 Z! R* M
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; }
     
298.                 #articlebody  p, #articlebody  div { line-height: 1.8em !important; margin: 10px 0; }
     + z) z9 l/ }5 f9 x! K
299.                         #articlebody  p *, #articlebody  div * { line-height: normal !important; }
     9 X! W, N/ x+ h* i4 s, ~
300.        
     
301.         #articlebody .addoninfo { border: 1px solid #EEE; }
     ! R# d- j# p7 m6 M1 S6 g
302.                 #articlebody .addoninfo h5 { font-size: 1em; margin: 0; line-height: 2em !important; border-bottom: 1px solid #EEE; padding-left: 1em; }
     3 e( J0 R# {! `9 C" c4 W
303.                 #articlebody .addoninfo ul { margin: 0.5em 0 0.5em 2em; padding: 0; }
     8 a: y1 m* g0 s. C* Z
304.                         #articlebody .addoninfo li { line-height: 1.6em !important; }
     & h2 I1 ^7 m+ E  \: _# t
305.        
     , f* ]( @6 t# v: |# S. D
306.         #articlebody img { width: expression(this.width > 500 ? 500: true); max-width: 500px;  }
     # x- _6 u9 I9 q7 G$ b
307.        
     
308.         #articlebody kbd.showvideo, #articlebody kbd.showflash { font: 1em Arial, Helvetica, sans-serif; cursor: pointer; text-decoration: underline; }
     9 V6 a/ z* h. Q& e8 i' a; L
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; }
     ( R8 d, W) @& c
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; }
     8 g7 y5 X+ t. p9 d
316. 
     ; O  k: u3 Z& m& F4 W1 {
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; }
     # ?3 C3 C3 s/ |9 t
323.         #xspace-rates { height: 2em; }
     / \/ R4 z2 c: z8 O7 J: `. A9 [
324.                 #xspace-rates label { float: left; line-height: 24px; margin-right: 5px; }
     * W. N7 n. m" n# f
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; }
     6 r" s) W2 ]0 X6 H
327.                         .xspace-rates-5 #xspace-rate-5, .xspace-rates-3 #xspace-rate-3, .xspace-rates-1 #xspace-rate-1, .xspace-rates0 #xspace-rate0, .xspace-rates1 #xspace-rate1, .xspace-rates3 #xspace-rate3, .xspace-rates5 #xspace-rate5 { background: #DDD; border-color: #BBB; font-weight: bold; }
     
328. 
     
329. /*AJAX div*/
     
330. .xspace-ajaxdiv { position:absolute; padding: 5px; border: 1px solid #BBB; background: #FCFFEF; text-align: left; }
     2 i) u, n6 U0 f& ~
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; }
     & W2 Z  `# H3 a: B  ~( J
334.                 .xspace-ajaxcontent form { margin: 0; }

复制代码

傲天♂浪子追风

1. /*-----------------------------------------------------------------------------------综合设置*/
   + q/ C9 ^. T; r# E, D6 B$ ]9 B8 ~
2. 
   4 |0 S9 e  N8 R
3. body { margin: 0; background: #FFF; color: #333; text-align: center; font: 12px Arial, Helvetica, sans-serif; }
   5 {% X$ X5 O" `1 H
4. #wrap { background: #FFF; margin: 0 auto; text-align: left; width: 910px; padding: 0 4px; w\idth: 910px; }
   5 M6 D# C1 _1 @5 C$ ?
5. 
   

复制代码

4 R' w( Z$ {5 y) |分析
- K3 m* B7 k+ {

1. margin属性说明：
   * Y0 d1 X" P, N
2. 
   
3. 检索或设置对象四边的外延边距。
   " t1 p# S2 J5 i9 G) D
4. 如果提供全部四个参数值，将按上－右－下－左的顺序作用于四边。
   . W+ R6 y* }- }/ H: o
5. 如果只提供一个，将用于全部的四边。
   
6. 如果提供两个，第一个用于上－下，第二个用于左－右。
   
7. 如果提供三个，第一个用于上，第二个用于左－右，第三个用于下。
   
8. 内联对象要使用该属性，必须先设定对象的height或width属性，或者设定position属性为absolute。
   
9. 在IE4+，margin属性不可用于td和tr对象。
   
10. 外延边距始终透明。
    
11. 
    5 [# g3 ]  W' W  v$ w7 e. z
12. color : 　指定颜色
      {! v6 g: [7 {9 R1 \% [
13. text-align:文本的对齐方式。(left : 　左对齐,right : 　右对齐,center : 　居中,justify : 　两端对齐)
    2 O; v% ^/ o* E, P; u
14. font: 12px Arial, Helvetica, sans-serif;  :这段是字体相关的
    $ c; y7 t5 B. c/ K6 ?4 t! T. T
15. 
    
16. 
    # O$ _+ L* ?! ^$ m6 `

复制代码

傲天♂浪子追风

1. /*链接样式*/
   7 P! r, K% C6 E+ W+ k1 C4 i. v- I
2. a { color: #000; text-decoration: none; }
   * Q: E. J6 a$ q# \* W1 Y; i
3.         a:hover { text-decoration: underline; color: #000098; }
   
4.                 a:visited { color: #666;}
   
5.         #topmenu a, #menu a, .imglist a, #hotspace li a { text-decoration: none; }
   
6.                 #topmenu a:hover, #menu a:hover, .imglist a:hover, #hotspace li a:hover { text-decoration: underline; }
   ; f5 z: p8 n0 `3 E8 m
7.         a img { border: none; }
   
8. li cite { font-style: normal; font-size: 12px; float: right; width: 4em; color: #999; }
   ; B# Z% \4 T  R+ G
9.         li cite a { color: #999; }
   
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; }
    # s( G" m. n0 t, t$ B* @
12. 
    

复制代码

9 Z  c/ e( n# e
! A  [, k( Y; i分析

' ]7 c% v2 a, i1 |3 p

1. 
   , Q, G& q) H/ _7 b1 y
2. text-decoration:文本连接的属性,一般有以下几种参数:
   $ d9 |) R: z" ~8 Y) A& o
3. none : 　无装饰
   
4. blink : 　闪烁
   
5. underline : 　下划线
   # H2 l1 q" `9 l7 b/ W1 N
6. line-through : 　贯穿线
   
7. overline : 　上划线
   8 Z1 |) z. \+ C3 n/ s+ }5 ^
8. 
   
9. 
   
10. hover:设置对象在其鼠标悬停时的样式表属性。
    
11. 
    
12. visited:对象在其链接地址已被访问过时的样式表属性。
    
13. 
    8 W1 U; l: Z: V1 d! w1 J( `# D6 t& [
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; }:
    6 E$ U$ k0 A5 d9 I, |
16. 上面这两行是与鼠标相关
    9 h; S/ e$ H! l  l$ ^5 r
17. 
    
18. a img { border: none; }图片连接相关
    # V7 y# f' D0 P0 e0 Z
19. 
    
20. 
    
21. cite:这个一般是引用标签的时候用的,不知道用来这里做什么
    7 r/ c7 x+ g5 r& k1 X
22. 
    9 {4 j2 j! ]  C  C0 h+ }
23. 
    
24. font-style:字体式样,一般常用参数有:
    
25. normal : 正常的字体
    ' f4 [& |8 N- p; y& _1 d4 a; O
26. italic : 斜体。对于没有斜体变量的特殊字体，将应用oblique
    - D; U  k5 Y" \* Y: g/ ^# o
27. oblique : 倾斜的字体
    
28. 
    - T' Z4 f) B: g
29. 
    + ]* N- I5 E  Q4 L
30. float: right 该属性的值指出了对象是否浮动及如何浮动。常用参数如下:
    9 V: g' R# G/ `$ F4 a
31. none : 　对象不浮动
    ' l4 }2 |  ^2 o$ z
32. left : 　对象浮在左边
    
33. right : 　对象浮在右边
    
34. 
    
35. 
    
36. important:样式表条目,提升指定样式规则的应用优先权。
    ( G! a: p; }5 F3 Y/ S" }
37. 
    $ q; X" q' Y) G/ b9 l' w
38. 
    8 A% U! n" J- V5 f$ Z/ x- e% l
39. background: transparent 这个的意思就是背景透明...
    
40. 
    
41. 
    
42. 
    , O) ^8 K. N# {1 o4 b# h% [) K9 K  {! t
43. font-weight: normal :文本字体的粗细,常用参数如下:
    , F) V4 }3 c4 v3 u/ u" U" ?
44. normal : 正常的字体。相当于number为400。声明此值将取消之前任何设置
    
45. bold : 粗体。相当于number为700。也相当于b对象的作用
    
46. bolder : IE5+　特粗体
    
47. lighter : IE5+　细体
    
48. number : IE5+　100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
    / B4 x7 X6 Z' R6 M) D
49. 
    ! `5 u1 Y  f5 |
50. cursor: pointer:这个是鼠标放在对象中的状态,简单点来可以这样说,也就是鼠标放在连接上的时候显示的鼠标形状,一般有以下N种参数,这个真的是TMD的多啊
    
51. 语法：(每一竖隔开为一个状态)
    ! h) n) M4 @- G& L
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)
    5 Q! y8 H9 L6 V% C" {
53. 
    
54. 
    
55. 
    
56. 
    , [2 ~; J- r& n- p8 y4 Z3 @
57. 
    - H4 x3 o0 R+ `! d
58. 
    
59. 
    , S" N2 e( A/ q$ V  G

复制代码

傲天♂浪子追风

1. /*-----------------------------------------------------------------------------------表单通用样式*/
   
2. 
   
3. form { margin: 0; }
   6 r. v- Z  S8 n4 p' b) N6 r) F
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;
   ( M9 I8 w3 z% Z; \- n, z1 B3 M
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

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

傲天♂浪子追风

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

傲天♂疯紫

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