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

傲天♂浪子追风

1. * { word-break: break-all; } /*在IE中实行强制换行*/
   
2. #newsblock { margin-top: 4px; }
   ( |/ M  y5 i# x0 e6 w" v
3. /*-----------------------------------------------------------------------------------综合设置*/
   
4. 
   
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; }
   . C2 V7 o# w* Q! U1 L; [
7. 
   6 f0 K4 v* [; l) o' A, C% X+ b6 D
8. /*链接样式*/
   ) B. W  K! A# s" y  `
9. a { color: #000; text-decoration: none; }
   3 I- C6 W: H% L
10.         a:hover { text-decoration: underline; color: #000098; }
    - n' `0 U4 R# W
11.                 a:visited { color: #666;}
    
12.         #topmenu a, #menu a, .imglist a, #hotspace li a { text-decoration: none; }
    - |  c- O2 f) ]+ |+ g
13.                 #topmenu a:hover, #menu a:hover, .imglist a:hover, #hotspace li a:hover { text-decoration: underline; }
    
14.         a img { border: none; }
    
15. li cite { font-style: normal; font-size: 12px; float: right; width: 4em; color: #999; }
    8 r" w8 G: r, I6 l2 u" U
16.         li cite a { color: #999; }
    1 \/ h8 h, V& ]: B  c- o+ C' {+ K
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; }
    : ?3 ?$ O! |5 ]2 M
19. 
    . x/ ?4 E9 \3 ]
20. /*-----------------------------------------------------------------------------------表单通用样式*/
    ( D. e+ h5 I5 {) V
21. 
    
22. form { margin: 0; }
    
23.         input, textarea, button, select { font: 1em Arial, Helvetica, sans-serif; }
    . s, C4 w! y# a0 n5 A* f2 C1 z
24.         button { height: 1.8em; padding: 0 0.3em; background: #9FC8DF; cursor: pointer; border: 1px solid;
    ! \+ I' [8 h3 _6 H. N0 X
25.                 border-top-color: #C9E3F0; border-right-color: #2A8ABA; border-bottom-color: #2A8ABA; border-left-color: #C9E3F0; }
    0 ~; h6 h$ }- f1 V
26.         fieldset { border: 0; padding: 0; }
    
27.                 legend { display: none; }
    , v6 I: x, @6 A+ x. D+ b  [# Q; E7 B
28.         label { cursor: pointer; margin-right: 0.5em; }
    " t- B8 [6 [6 d; k3 K4 P+ @
29. 
    & ?9 _% E6 z! T, n
30. /*-----------------------------------------------------------------------------------头部风格 Header*/
    3 K$ ?# K6 M% d) [# q2 j
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; }
    - n% I; J9 t% S5 i
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. 
    . n! p0 W/ ]. R9 I8 f+ ^0 T
41. /*主导航*/
    3 K$ E) ~5 Z! x$ i$ Z
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; }
    
45.         /*首页导航*/
    4 H% g8 M: t7 t
46.         #menu dl { margin: 0 1.5em; padding: 0; height: 25px; overflow: hidden; }
    
47.                 #menu dt { float: left; width: 4em; white-space: nowrap; }
    ' k- J2 I* r# U# ?8 |# J
48.                         #menu dt a { color: #000098 !important; }
    , g$ z6 o! y0 n2 d. _
49.                 #menu dd { float: left; width: 6em; margin: 0 2px; overflow: hidden; white-space: nowrap; }
    9 q1 O* [* l% A8 a
50. 
    
51. /*您的位置导航*/
    ! Z4 d0 G- a$ S( ]
52. #navigation { padding: 1.2em 0; }
    
53.         #navigation p { margin: 0;}
    
54.                 #navigation p a, #navigation p strong { margin: 0 0.5em; }
    % B" B0 m/ U  [0 u7 h& D
55.         #searchform { float: right; }
    
56.                 #searchform * { vertical-align: top; }
    ! G6 z7 A$ D9 ?
57.                 #searchform button { margin-left: 0.5em; }
    1 N3 Y6 L6 H' \+ M
58. 
    # f6 I/ S6 X2 U& 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; }
    ) P# D# r& b/ ]+ c+ w& a
61.                 .simplepage h2 { margin: 0; font-size: 1.2em; padding-left: 0.5em; }
    
62. 
    
63. /*-----------------------------------------------------------------------------------布局*/
    & [. e7 H6 R: `% S1 A* z7 k0 U6 X0 P
64. 
    ! |; Z5 u* Z5 z- _" w7 q
65. .content { /*三列布局*/
    5 x: x* _. r! `, z0 y+ L1 d! G/ @# [
66.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y 0 0; }
    4 W8 P* n4 a: e/ m
67.         /*\*/ * html .content { height: 1%; } /**/ *>.content { overflow: hidden; }
    ) V" Y; o4 O- G/ O! E
68. .contentL { /*两列布局，侧边在左侧*/
    
69.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y -590px 0; }
    
70.         /*\*/ * html .contentR { height: 1%; } /**/ *>.contentR { overflow: hidden; }
    
71. .contentR { /*两列布局，侧边在右侧*/
    
72.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y 580px 0; }
    % F, M+ \2 Z& e6 Q0 z* t) _+ M
73.         /*\*/ * html .contentR { height: 1%; } /**/ *>.contentR { overflow: hidden; }
    ) J' d6 E" K; p
74. /*侧边样式*/
    + K' z8 G2 }" l2 v  `6 B8 s) f% y
75. .sideL { width: 296px; float: left; overflow: hidden; }
    
76. .sideR { width: 202px; float: right; overflow: hidden; }
    
77. /*中间部分样式*/
    
78. .mainarea { margin: 0 4px; width: 382px; float: left; }
    
79.         .contentL .mainarea { margin: 0 0 0 4px; width: 556px; }
    5 u2 ^' q4 y) p. I# ?7 \  i
80.         .contentR .mainarea { margin: 0 4px 0 0; width: 576px; }
    + |8 j3 g1 k% X$ w
81. 
    
82. /*-----------------------------------------------------------------------------------版块样式*/
    5 s, J, p1 w9 e% E
83. 
    , @: k- e+ Y+ h* u8 [0 q  j: c
84. /*版块标题*/
    2 z0 A1 C/ R  F
85. .blocktitle { clear: both; border: 1px solid #86B9D6; padding: 1px; margin-bottom: 4px; line-height: 30px; }
    / C7 }: m3 f# ]" Y2 f  ^* H3 w
86.         .blocktitle h2 { font-size: 1.2em; margin: 0; padding: 0 5px; background: #9FC8DF url(../images/new/title_bg.gif) repeat-x; }
    ( _4 d) T4 N! d/ e" j# _
87.         .blocktitle .more { margin-right: 5px; }
    1 ^& _" W4 \" u2 Y3 |! w
88. 
    ' g4 u2 _! l0 @0 ~! q+ B
89. /*头条信息*/
    4 c% ]* I8 p0 g$ F
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; }
    * q8 p* H3 \- ^3 |. @0 m
93.         #headline img { float: right; width: 48px; height: 48px; border: 4px solid #FFF; }
    : N& `0 h' N: Q! ~
94. 
      \' o. R/ E( I1 {- k
95. /*侧边版块*/
    , O$ T7 x  E0 g. c1 X
96. .sideblock { margin: 0 0 3px; border: 1px solid #86B9D6; background: #FFF; padding: 3px; }
    
97.         .boldblock { padding: 1px; background: #9FC8DF; } /*突出版块*/
    
98.         .cleanblock { border: 1px solid #86B9D6; margin: 0 0 4px; padding: 0; background: #F5FBFF; } /*简单版块*/
    : b4 U1 H9 D/ k1 C& @7 ~& |
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%; } /**/
     ; k$ }, Y' I8 K3 M, ^- B) h9 v
101.                 .sideblock p { margin: 0.3em; line-height: 1.6em; }
     
102.                         .headimg { float: right; margin: 5px 0 2px 5px; width: 80px; height: 80px; border: 4px solid #E2F0F9; }
     / @0 j& r& |) f; ^; ?2 A
103. 
     
104.         /*侧边多行列表*/
     
105.         .sideblock dl { margin: 0; padding: 5px; background: #FFF; line-height: 1.8em; }
     2 o( P; |6 z! W- S- S$ O9 P
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; }
     4 C9 z! P. o7 b1 z8 P
108.                 .sideblock dd { color: #999; margin-left: 0.8em; }
     5 U; u4 k' A6 N6 w: _
109.                         .sideblock dd a { color: #999; }
     
110. 
     
111. /*单行信息列表*/
     
112. .msgtitlelist { margin: 0; padding: 5px 0; list-style: none; line-height: 1.6em; }
     ! M! w, m5 L4 R1 u1 ?" _
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; }
     - s- Q. J( P9 e+ F* Z2 [% y8 d
115.         .sideblock .msgtitlelist { background: #FFF; }
     0 K4 I$ Z( Z6 a
116. 
     # u' j( a* ~6 b
117. /*多行信息列表*/
     
118. .messagelist { margin: 5px 0; padding: 0; list-style: none; line-height: 1.6em; }
     
119.         .messagelist li { margin: 5px 0 10px 0;}
     . u* K* O) P# V- e3 [  U4 ?  m
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; }
     + i% g% I+ H: ]- i/ j
122.                                 .messagelist li h4 a:visited { font-weight: normal; }
     : y$ @5 `* `( z# v( V; f
123.                 .messagelist li p { margin: 0; }
     / R+ p! p- l% y( I- Q& b; x' W! [
124. 
     5 U* e1 Y, \% W8 W- J1 E$ J) I+ t& {  X; b
125.         .messagelist dl { margin: 0; padding: 0; line-height: 1.6em; }
     % i% O# j5 P; f, N3 s) K6 v' [
126.                 .messagelist dt { background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.7em; padding-left: 0.8em; }
     : j+ o6 c* ]0 E3 e& z
127.                 .messagelist dd { font-size: 12px; margin: 0; padding-left: 1em; color: #999; }
     
128.                         .messagelist dd a { color: #999; }
     
129. 
     
130. /*热门话题*/
     1 o1 \6 b  o; Y3 H& L7 k. H3 ]
131. #hottag { overflow: hidden;  }
     
132.         #hottag div { background: #FFF; padding: 0.5em; overflow: hidden; line-height: 1.8em; }
     5 w6 Q  l8 H: Y
133.                 #hottag div { color: #999; overflow: hidden; }
     8 Q  ]4 W! x5 Q9 u
134.                 #hottag a { margin-right: 0.2em; white-space: nowrap; }
     5 }2 d4 W0 [" Y
135.                         #hottag a em { color: #999; font-style: normal; }
     * F' O6 Z: L8 @( y/ ^/ l1 K8 |
136. 
     
137. /*用户面板*/
     
138. #userpanel { height: 8.8em; overflow: hidden; }
     3 y3 j* T  i; W  Y
139.         #userpanel form { margin: 5px auto !important; margin: 0 auto; width: 150px; }
     
140.                 #userpanel input { width: 90px; }
     6 f5 Z" ^% P$ Q9 \' y
141.                 #userpanel p { margin: 0.5em 0; }
     ' X5 S% o8 D7 {. f" S0 R
142.                 #dologin { float: right; }
     9 z% }6 ^" s9 r; ?
143.                 #userpanel form a { line-height: 2em; color: #B353B3; border-right: 1px solid #86B9D6; padding-right: 5px; }
     1 @% T3 A6 k6 \$ @- h9 J" n% P% 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; }
     
147. 
     # _/ e. C! b$ c% M5 r
148. /*空间之星*/
     : {9 Z* `3 l! E  E* F) R( b  w
149. #spacestar ul { width: 168px; margin: 0 4px; padding: 0; height: 235px; }
     - z% W: {1 l" ^/ }7 R3 I& y
150.         #spacestar li { float: left; display: inline; width: 54px; height: 70px; overflow: hidden; margin: 3px 1px; background: #E2F0F9; text-align: center; }
     0 i) N# M5 U6 L# j$ v- ]7 [2 V
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. 
     
154. /*同城空间*/
     
155. #cityspace { background: #F0F9FF; }
     6 D" y7 o, i# m6 R* C- E
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. /*空间排行*/
     3 S3 _6 _" X2 J5 C# F" H0 E) R; R' u
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; }
     ) n1 ]0 \7 P$ S' b# a
164.         #hotspace em { float: right; font-style: normal; font-size: 9px; color: #999; width: 40px; }
     
165. 
     
166. /*热门文章 */
     ! @* \' ]& ?# f9 T! s, m
167. #hotarticle { border: 1px solid #86B9D6; background: #E2F0F9; padding: 3px; position: relative; }
     . {0 `/ t' K" t. `# z7 |
168.         #hotarticle h3 { font-size: 1.2em; margin: 0; line-height: 22px; border-bottom: 1px solid #86B9D6; }
     * [2 r' J% L1 F' Q
169.         #hotarticletabs { position: absolute; margin: 0; line-height: 18px; top: 7px!important; top: 8px; right: 10px; }
     " ?8 A6 a; }1 Q0 d  v
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; }
       Z5 W' P7 E0 ?8 E
172.         #hotarticle ul { background: #FFF; margin: 0; padding: 0.5em; list-style: none; line-height: 1.7em; height: 16.5em; overflow: hidden; }
     1 c! ?: f" `% a: F2 E7 D1 H
173.                 #hotarticle li { height: 1.7em; overflow: hidden; color: #999; padding-left: 0.8em; background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.7em; }
     
174. 
     
175. /*图片列表*/
     " E# B- S/ }8 h3 M# W5 K
176. .imgthumblist { margin: 0 3px; padding: 0; list-style: none; }
     + P- n! l5 y0 M* m1 @3 W/ M+ E
177.         /*\*/ * html .imgthumblist { height: 1%; }/**/ *>.imgthumblist { overflow: hidden; }
     ; k6 Z5 d" \2 O5 i1 ]( o
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; }
       O/ m9 ~4 `! q) }# l
179.                         .imgthumblist li.list1line { height: 123px; height: 115px; }
     
180.                         .imgthumblist li.list2line { height: 143px; height: 135px; }
     # j& t4 [  w9 C9 I3 F) x
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; }
     7 \4 J+ G' @3 N; b! y9 F% K) y. c' z
184.         .throughgallery { width: 100%; clear: both; margin-bottom: 5px; padding-bottom: 3px; background: #E2F0F9; }
     
185.                 .throughgallery .imgthumblist { margin: 0; }
     
186.                 .throughgallery .imgthumblist li { height: 120px; margin: 3px 1px; }
     
187. 
     
188. /*商品*/
     & Y: W5 x! r1 y& @0 R7 y# V; {3 T
189. /*\*/ * html .goodsthumblist { height: 1%; } /**/ *>.goodsthumblist { overflow: hidden; }
     
190.         .goodsthumblist { margin: 0; padding: 3px 0; list-style: none; }
     7 c$ S3 n# i( E8 l8 }" G6 d
191.                 .goodsthumblist li { float: left; width: 90px; height: 100px; text-align: center; }
     
192.                         .goodsthumblist li img { width: 70px; height: 70px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED; }
     
193.                         .goodsthumblist li p { margin: -3px 0 0 !important; margin: 0; height: 1.5em; line-height 1.5em; overflow: hidden; }
     1 t* v! `0 l$ x/ _* q. K. _8 ?. A
194. 
     
195. .imgtitlelist { margin: 10px 0; padding: 0; list-style: none; }
     . U0 u9 E  m- W$ M
196.                 .imgtitlelist li { padding-left: 85px; padding-bottom: 5px; margin: 5px 0; border-bottom: 1px solid #E2F0F9; }
     5 j5 u( U( N7 a$ t' [+ n/ k; @$ I
197.                 /*\*/ * html .imgtitlelist li { height: 1%; } /**/ .imgtitlelist>li { overflow: hidden; }
     
198.                         .imgtitlelist li h4 { margin: 0.3em 0; font-size: 1em; }
     1 w. t" q% H/ t5 }( U9 }
199.                         .imgtitlelist li img { float: left; margin-left: -85px; width: 70px; height: 70px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED; }
     ( V: m5 U4 ~5 N8 i- k$ n" ~' w5 F
200.                         .imgtitlelist li p { margin: 0; line-height: 1.5em; }
     0 @9 Q" A) z. P! S  l- b
201.         .sideblock .imgtitlelist li { padding-left: 65px; }
     
202.                 .sideblock .imgtitlelist li img { width: 48px; height: 48px; margin-left: -60px; }
     
203.        
     
204. 
     : s6 b1 s4 g3 u) b0 w5 V  O
205. /*栏目区块列表*/
     : W' M3 O+ m/ P" {6 p
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; }
     2 F) T. V- h5 D6 ~: A$ ^8 P. j! D4 U
209.                         .category h3 strong a { color: #333; text-decoration: none; }
     + b: N) a) }5 O  Z- j" p
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; }
       U4 k8 E: C! [) x& g
212.         .catecommend { background: #F0F9FF; margin: 0; line-height: 2em; height: 2em; overflow: hidden; padding: 0 1em; }*/
     
213.                 .catecommend a { color: #000099; white-space: nowrap; margin-right: 0.5em; }
     
214. 
     
215. 
     
216. /*-----------------------------------------------------------------------------------首页各版块*/
     $ K/ @  R1 \# |% ]
217. 
     
218. /*#commendimage { height: 155px; }
     
219. #topicnews { height: 217px; }
     . K6 T8 M! \  d3 d0 `; I8 J- h
220. #newgoods, #commendgoods { height: 200px; }
     
221. #hotcommentfile, #hotfile, #newlink, #hotlink { height: 220px; }*/
     
222. 
     
223. 
     
224. 
     4 T; j7 ^5 F4 c6 Z7 R  l( n' m$ `
225. 
     
226. /*信息列表*/
     
227. .articlelist li { padding-left: 60px; }
     
228.         .articlelist h4 img { float: left; margin-left: -60px; width: 48px; height: 48px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED; }
     
229. /*.articlelist  h3 a { font-size: 12px; font-weight: normal; margin-left: 1em; color: #B353B3; }
     
230.        
     4 s& l  o8 N6 x- l: N: L1 k
231.         .articlelist ul { margin: 0; padding: 0; background: #FFF; padding-left: 5px; list-style: none; }
     
232.                 .articlelist li { position: relative; padding-left: 60px; margin-top: 1em; }
     ! n, d7 ~7 V( N/ c
233.         .articlelist h4 { margin: 0; background: #F0F9FF; font-size: 1.2em; padding: 0.2em 0.5em; cursor: pointer; }
     ! Q( Y3 q2 H# R( J' a% W  J0 }
234.                 .articlelist h4 em { font-style: normal; font-weight: normal; font-size: 0.8em; color: #B353B3; margin-left: 0.3em; }
     - n6 {1 G+ B+ h7 A* `
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; }
     
237.                
     
238.                 .articlelist li strong { font-weight: normal; color: #999; line-height: 2em; padding-left: 0.5em; }
     # C- S4 O3 b( J  X- g! ]; d4 ]
239.                         .articlelist li strong a { color: #999; }
     
240.                 .articlelist li p { margin: 0.3em 0; line-height: 1.6em; }
     
241.                         .articlelist li p a.more { float: none !important; }*/
     % }2 w! {+ ]# n9 h! n
242. 
     
243. 
     6 m7 h. ^! p- u- `/ K
244. .catepic { text-align: center; }
     # b4 g6 m" s5 g/ ~4 J- O( P
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. 
     1 x% u' j+ `6 ]3 D3 c2 E. h/ n
249. /*专题列表*/
     ' H, h1 k/ G1 r  h0 A$ \5 _, n) Q/ p
250. #subjectlist { border-color: #86B9D6; padding: 2px; }
     # v) M1 v( S) N$ z3 F* \) l
251.         #subjectlist h3 { border: none; background: #9FC8DF; }
     6 g4 R$ ~( A$ l8 K( {
252.         #subjectlist li { border-bottom: 1px solid #E2F0F9; text-align: center; padding: 3px; }
     
253.                 #subjectlist p { margin: 0; line-height: 1.2em; }
     5 i5 f4 s; `* h
254. 
     # H6 o6 ^2 y8 I5 a( i& [
255. 
       M* F7 h3 c& [  K/ e1 _+ [  U
256.         #xspace-rates { height: 2em; }
     
257.                 #xspace-rates label { float: left; line-height: 24px; margin-right: 5px; }
     
258.                 #xspace-rates a { float: left; border: 1px solid #EEE; text-decoration: none; width: 20px; height: 20px; text-align: center; line-height: 20px; margin: 0 2px; }
     
259.                         #xspace-rates a:hover { border-color: #CCC; }
     6 _# W- z* B& ^; W. Z+ K6 g( m
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; }
     3 `7 a# e. E0 W- W2 B
261. 
     
262. 
     
263. #panel { width: 600px; overflow: hidden; margin: 1em auto; }
     ) u* N0 m3 @5 Q; [5 v
264. 
     
265. 
     " W5 L# Z+ E* i' E7 R8 U
266. /*Pages*/
     1 u. w  m, ^# H" Y; @
267. .pages { text-align: right; border-top: 1px solid #9FC8DF; }
     
268.         /*.pages table { margin: 3px 0 3px auto; text-align: center; }
     
269.                 .pages td { padding: 0 5px; border: 1px solid #B9D0ED; background: #FFF; }
     
270.                 .pages a { text-decoration: none; }
     
271.                 .pages .currentpage { background: #F0F9FF; border-color: #86B9D6; font-weight: bold; }*/
     
272. 
     # F: @, c  \# L/ P4 ?" d0 b
273. /* 分页 */
     9 K3 g; Z/ u' H. K, s6 K" o
274. .xspace-page { margin: 2px 2px 2px auto; }
     % ~  Y4 ]' }+ h' ~2 z0 S3 q8 E
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; }
     ! l) n8 k4 m5 p7 n
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; }
     2 ?$ b7 n" P& i: N' R6 ]% U
279. 
     
280. .smalltxt { font-size: 12px; color: #999; font-weight: normal; }
     ! _% \6 _1 f) M* Z0 E* s
281.         .smalltxt a, .smalltxt a:visited { color: #999 !important; }
     - u; D! @5 X( ^1 f3 y. S) n) Q
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; }
     6 k( P1 B- c' c: C0 r. \( n$ r
285.         #footer p { margin: 0.3em 0; color: #999; }
     
286.         #footer strong { color: #007AB6; }
     
287.         #footer em { font-style: normal; font-weight: bold; color: #96A800; }
     9 S: g! |) m+ Y
288.        
     
289. .imglogolist { margin: 0; padding: 0; list-style: none; text-align: center; }
     * W4 t' s- Z. i, Q9 s/ k
290.        
     # W9 \; q+ U" _
291. #articledetail { border: 1px solid #86B9D6; text-align: center; }
     # b8 D1 c% p. ^* `/ |4 M+ C
292. .articletitle { font-size: 1.6em; margin: 1em 0 0.5em; }
     
293. .articleinfo { border-bottom: 1px solid #9FC8DF; margin: 0;}
     ) R5 X# f1 a$ r5 c& ]. }9 _
294. .articlectrl { margin: 0.5em 0 1.5em; }
     ; A# [: o) @9 I0 o( e- u, I
295. 
     
296.         #articlebody { width: 98%; margin: 0 auto; overflow: hidden; text-align: left; overflow-y: hidden; line-height: 1.8em; font-size: 1.2em; }
     : _& U5 e# W( o+ d
297.         #articlebody * { line-height: normal; }
     
298.                 #articlebody  p, #articlebody  div { line-height: 1.8em !important; margin: 10px 0; }
     
299.                         #articlebody  p *, #articlebody  div * { line-height: normal !important; }
     6 d0 L) g$ N8 s$ U; e0 S  M
300.        
     2 S# v) P* x9 K3 N/ Z: f6 e$ }8 Y
301.         #articlebody .addoninfo { border: 1px solid #EEE; }
     % n5 x) _. F8 a5 f
302.                 #articlebody .addoninfo h5 { font-size: 1em; margin: 0; line-height: 2em !important; border-bottom: 1px solid #EEE; padding-left: 1em; }
     + [  X& h$ U; Y1 d0 C: P
303.                 #articlebody .addoninfo ul { margin: 0.5em 0 0.5em 2em; padding: 0; }
     
304.                         #articlebody .addoninfo li { line-height: 1.6em !important; }
     
305.        
     
306.         #articlebody img { width: expression(this.width > 500 ? 500: true); max-width: 500px;  }
     # h1 s2 S! Q" a- X8 F
307.        
     1 f9 F4 I% W1 z# @! r* ]$ I
308.         #articlebody kbd.showvideo, #articlebody kbd.showflash { font: 1em Arial, Helvetica, sans-serif; cursor: pointer; text-decoration: underline; }
     . {) N1 r- N; U$ ]/ z) o% G8 [7 z
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; }
     * l: y6 w5 c- n( b
311.                                 #commentlist img { max-width: 500px; width: expression(this.width > 500 ? 500: true); }
     % c3 f( }+ _7 D/ l
312.                         #commentlist .messagelist li div { width: 98%; margin: 0 auto; overflow: hidden; text-align: left; overflow-y: hidden; line-height: 1.8em; }
     6 v7 T; n. K( i+ k
313.                                 #commentlist .messagelist li div * { line-height: normal; }
     & `- z5 u9 ]% X4 }: y3 [; `
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; }
     , M, v/ t  D+ b1 O2 c7 A
316. 
     . l% d1 o/ r! @' E) N
317. /*发表评论*/
     ' j9 Z4 C( G1 q- h" {7 ^# r. V% j
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; }
     ( U& u" \% T) t. f2 V
321.         #comment p { margin: 0.3em 0; }
     
322.         .seccodeline * { vertical-align: middle; }
     : W* t7 l1 N; s/ H0 d* x8 ^
323.         #xspace-rates { height: 2em; }
     4 I4 {# C( D! ]- `
324.                 #xspace-rates label { float: left; line-height: 24px; margin-right: 5px; }
     / K4 ~: ~3 q0 H$ w/ q+ `
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; }
     ( b( o( w. r3 O- d+ H; j# J
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; }
     , _# h" P1 p8 l) N; z
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; }
     + P. y$ P, W/ ~3 I  e" E# b
334.                 .xspace-ajaxcontent form { margin: 0; }

复制代码

傲天♂浪子追风

1. /*-----------------------------------------------------------------------------------综合设置*/
   : p, x2 ~! M! v, A  O! C9 c
2. 
   
3. body { margin: 0; background: #FFF; color: #333; text-align: center; font: 12px Arial, Helvetica, sans-serif; }
   7 c% ?, E- {6 w2 t& h) M
4. #wrap { background: #FFF; margin: 0 auto; text-align: left; width: 910px; padding: 0 4px; w\idth: 910px; }
   
5. 
   

复制代码

' E- @# w3 }  b6 F: d分析

5 S) l* J" e; f% Y

1. margin属性说明：
   
2. 
   - @- g; p" Q5 g
3. 检索或设置对象四边的外延边距。
   - _; f2 Y7 g: d
4. 如果提供全部四个参数值，将按上－右－下－左的顺序作用于四边。
   % g0 O/ Z, {9 m. b
5. 如果只提供一个，将用于全部的四边。
   8 r! e- Z3 n6 ?. `6 c+ c" r2 D
6. 如果提供两个，第一个用于上－下，第二个用于左－右。
   
7. 如果提供三个，第一个用于上，第二个用于左－右，第三个用于下。
   $ ]0 z) D0 S! i5 l( n0 O  _; ~2 I
8. 内联对象要使用该属性，必须先设定对象的height或width属性，或者设定position属性为absolute。
   - S5 j* j8 [; c8 J% k
9. 在IE4+，margin属性不可用于td和tr对象。
   2 l" }/ \+ k6 m; d; j
10. 外延边距始终透明。
    & _) |' L  k# E1 R( L
11. 
    
12. color : 　指定颜色
    " L; D* L5 U: A. u- W. B
13. text-align:文本的对齐方式。(left : 　左对齐,right : 　右对齐,center : 　居中,justify : 　两端对齐)
      K6 {4 [1 }" s
14. font: 12px Arial, Helvetica, sans-serif;  :这段是字体相关的
    
15. 
    
16. 
    

复制代码

傲天♂浪子追风

1. /*链接样式*/
   ; `( F+ ]( J+ x4 R
2. a { color: #000; text-decoration: none; }
   
3.         a:hover { text-decoration: underline; color: #000098; }
   
4.                 a:visited { color: #666;}
   9 J4 M' y  X/ I; j( ]+ D
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; }
   , Z- A+ w4 Z" I5 d9 C
8. li cite { font-style: normal; font-size: 12px; float: right; width: 4em; color: #999; }
   4 I7 T6 C/ S- s7 v. Z
9.         li cite a { color: #999; }
   
10.                 li cite a:visited { color: #999; }
    9 g% S1 I, ^. M/ z. J4 |4 P& C
11. .more { float: right !important; color: #000098 !important; background: transparent !important; font-size: 12px !important; font-weight: normal !important; cursor: pointer; }
    3 ^' z/ c) y1 o; z! I
12. 
    # Q, c) y( i3 @4 x, x+ m# T, M0 g

复制代码

5 |6 O) t; x! h/ M$ |分析
4 |+ C' m8 Q9 Y; h1 O
( ^, ~- M6 _/ m# x. N

1. 
   
2. text-decoration:文本连接的属性,一般有以下几种参数:
   
3. none : 　无装饰
   
4. blink : 　闪烁
   
5. underline : 　下划线
   
6. line-through : 　贯穿线
   
7. overline : 　上划线
   
8. 
   
9. 
     h. Z- u* y; q
10. hover:设置对象在其鼠标悬停时的样式表属性。
    2 d8 s& o9 R5 T: a( N3 \
11. 
    ! I& |9 E2 N; w
12. visited:对象在其链接地址已被访问过时的样式表属性。
    " p( g5 s/ v+ z
13. 
    
14. #topmenu a, #menu a, .imglist a, #hotspace li a { text-decoration: none; }
    
15. #topmenu a:hover, #menu a:hover, .imglist a:hover, #hotspace li a:hover { text-decoration: underline; }:
    
16. 上面这两行是与鼠标相关
    
17. 
    8 _) T0 p4 Q0 R4 \1 V9 f- R" R! J
18. a img { border: none; }图片连接相关
    
19. 
    
20. 
    1 @9 y- X4 P. J9 W8 Y9 E$ V9 F
21. cite:这个一般是引用标签的时候用的,不知道用来这里做什么
    
22. 
    
23. 
    
24. font-style:字体式样,一般常用参数有:
    
25. normal : 正常的字体
    
26. italic : 斜体。对于没有斜体变量的特殊字体，将应用oblique
    0 Y) B" t" X: n- U/ X0 p
27. oblique : 倾斜的字体
    " z# I' c$ z: T
28. 
    
29. 
    
30. float: right 该属性的值指出了对象是否浮动及如何浮动。常用参数如下:
    3 f+ w6 C8 R) U3 c# \/ U
31. none : 　对象不浮动
    
32. left : 　对象浮在左边
    
33. right : 　对象浮在右边
    + X# s( B- m( E& v7 m
34. 
    
35. 
    
36. important:样式表条目,提升指定样式规则的应用优先权。
    
37. 
    ( G: w! a6 i1 d
38. 
    0 g9 _; S  ^; x- b$ K3 x
39. background: transparent 这个的意思就是背景透明...
    
40. 
    
41. 
    
42. 
    
43. font-weight: normal :文本字体的粗细,常用参数如下:
    
44. normal : 正常的字体。相当于number为400。声明此值将取消之前任何设置
    ; d- v1 x0 y% w$ Z9 r
45. bold : 粗体。相当于number为700。也相当于b对象的作用
    : ]$ d: z* J3 ~, Z7 H: e  W* [
46. bolder : IE5+　特粗体
    
47. lighter : IE5+　细体
    
48. number : IE5+　100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
    . D, V) q+ C5 H: b  E9 a5 Y
49. 
    $ @% F/ s' H8 k; L1 I; a( K! u
50. cursor: pointer:这个是鼠标放在对象中的状态,简单点来可以这样说,也就是鼠标放在连接上的时候显示的鼠标形状,一般有以下N种参数,这个真的是TMD的多啊
    ; t2 [' S" Q6 o
51. 语法：(每一竖隔开为一个状态)
    5 d! w/ N% T7 |9 W, K
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. 
      Y1 j  F9 g" O" U. _
54. 
    . I% F0 k0 S# C. |1 y, D. y5 n5 c
55. 
    + X+ G! j6 ~, }) W3 ]4 @9 _' G; Y
56. 
    
57. 
    1 U( p" ]3 P& v, O5 Q
58. 
    
59. 
    % X) u" I, K. Y" r! j* I

复制代码

傲天♂浪子追风

1. /*-----------------------------------------------------------------------------------表单通用样式*/
   8 S! i* T8 e2 \7 _
2. 
   . i7 w+ q' \$ V2 P" [
3. form { margin: 0; }
   ( Q& ?: }& h; H. u
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; }
   ! r" `  h2 @& I0 f$ @3 D
7.         fieldset { border: 0; padding: 0; }
   - G8 }7 l! Z  U6 ?
8.                 legend { display: none; }
   
9.         label { cursor: pointer; margin-right: 0.5em; }
   

复制代码

bronwen

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

傲天♂浪子追风

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

傲天♂疯紫

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