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

傲天♂浪子追风

1. * { word-break: break-all; } /*在IE中实行强制换行*/
   
2. #newsblock { margin-top: 4px; }
   4 G0 J+ e" M. H5 Y' n
3. /*-----------------------------------------------------------------------------------综合设置*/
   ' f( C, R% V* a' z" ?. C
4. 
   " ^, I) R: g/ |! R+ h; Q4 \' s" n4 a
5. body { margin: 0; background: #FFF; color: #333; text-align: center; font: 12px Arial, Helvetica, sans-serif; }
   ( O- [8 }5 `6 j& t0 b
6. #wrap { background: #FFF; margin: 0 auto; text-align: left; width: 910px; padding: 0 4px; w\idth: 910px; }
   
7. 
     L0 j1 m1 L' o4 P' s( ?
8. /*链接样式*/
   
9. a { color: #000; text-decoration: none; }
   , l. F) ~% s  R1 j& @: k2 x& D
10.         a:hover { text-decoration: underline; color: #000098; }
    
11.                 a:visited { color: #666;}
    . N5 y+ z' y& u. g
12.         #topmenu a, #menu a, .imglist a, #hotspace li a { text-decoration: none; }
    
13.                 #topmenu a:hover, #menu a:hover, .imglist a:hover, #hotspace li a:hover { text-decoration: underline; }
    
14.         a img { border: none; }
    4 @$ B  ]+ A& e! `- Z
15. li cite { font-style: normal; font-size: 12px; float: right; width: 4em; color: #999; }
    
16.         li cite a { color: #999; }
    , \$ R4 C0 u- k' {* K& |" ?
17.                 li cite a:visited { color: #999; }
    4 ?- c7 z/ ~3 y0 \0 j
18. .more { float: right !important; color: #000098 !important; background: transparent !important; font-size: 12px !important; font-weight: normal !important; cursor: pointer; }
    
19. 
    ; a3 N+ G/ {! q( ?9 G# A7 M/ [
20. /*-----------------------------------------------------------------------------------表单通用样式*/
    ; z6 @9 j: d# S' y0 y
21. 
    0 B/ b1 [: n4 A  J$ ^8 w
22. form { margin: 0; }
    1 r& B" p4 J' F/ J0 i# J; ~0 s
23.         input, textarea, button, select { font: 1em Arial, Helvetica, sans-serif; }
      j7 }) ?2 D1 h# b
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; }
    5 h/ J" M$ }/ C* }! M" ]: r
27.                 legend { display: none; }
    
28.         label { cursor: pointer; margin-right: 0.5em; }
    # ?0 V5 Q) Z5 x; \
29. 
    + y+ G2 g- l' Z% v- d1 U
30. /*-----------------------------------------------------------------------------------头部风格 Header*/
    
31. /*顶部导航*/
    $ f! W6 g  T6 @  }0 q9 `* p' N( |
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; }
    6 E6 v% @8 x$ A
33.         #topmenu ul { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid #86B9D6; }
    ' r! E# G  \# ?
34.                 #topmenu li { display: inline; border-left: 1px solid #86B9D6; padding-left: 1em; padding-right: 0.5em; }
    
35.                         #topmenu a { color: #154BA0; }
    
36. 
    * l1 y! }% ^# f; E$ E/ y6 u4 f8 I: X
37. #pagetitle { padding: 8px 0; height: 76px; he\ight: 60px; border-bottom: 4px solid #F5FBFF; }
    ) g. k: U# |/ A1 h; r/ y
38.         #logo { border-right: 1px solid #86B9D6; padding: 0 10px; margin-right: 10px; }
    
39.         .banner468 { float: right; }
    6 g+ Y8 ?7 p3 V
40. 
    : {- p- w. P/ t
41. /*主导航*/
    $ Z% J# U% S. [) ^/ U. E
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; }
    1 A% e3 b4 D: B" c( A
45.         /*首页导航*/
    6 ]+ z5 T7 M$ G/ @
46.         #menu dl { margin: 0 1.5em; padding: 0; height: 25px; overflow: hidden; }
    ! R$ n8 ^" \1 c% N% B
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; }
    
50. 
    
51. /*您的位置导航*/
    
52. #navigation { padding: 1.2em 0; }
    2 {3 d. T0 X( Y
53.         #navigation p { margin: 0;}
    / d9 ~2 O2 E2 _5 j7 w
54.                 #navigation p a, #navigation p strong { margin: 0 0.5em; }
    
55.         #searchform { float: right; }
    
56.                 #searchform * { vertical-align: top; }
    
57.                 #searchform button { margin-left: 0.5em; }
    
58. 
    6 s: [" q4 ]& ^7 s! Y
59.         #navigation.simplepage { padding: 0; border-top: 2px solid #009DEA; border-bottom: 1px solid #009DEA; line-height: 25px; background: #EFF5FF; margin-bottom: 1em; }
    + g' q7 m6 z" z1 j8 w( l5 r& R! r
60.                 #navigation.simplepage p { float: right; margin-right: 0.5em; }
    1 C. I( t: D. J4 a$ p
61.                 .simplepage h2 { margin: 0; font-size: 1.2em; padding-left: 0.5em; }
    5 q% D' K9 w1 O2 m% s& p
62. 
    
63. /*-----------------------------------------------------------------------------------布局*/
    
64. 
    
65. .content { /*三列布局*/
    5 t0 y/ y6 g5 a& {$ I2 @% t
66.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y 0 0; }
    7 N  R* Y& i8 ^  _/ [
67.         /*\*/ * html .content { height: 1%; } /**/ *>.content { overflow: hidden; }
    9 K, g9 U: Z1 R$ ]& w7 O0 u0 z
68. .contentL { /*两列布局，侧边在左侧*/
    + N  o- d4 v8 g6 ^( i0 e, S/ e, ~% L
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; }
    
73.         /*\*/ * html .contentR { height: 1%; } /**/ *>.contentR { overflow: hidden; }
    
74. /*侧边样式*/
    6 P. P; k+ y0 R: `. p8 \
75. .sideL { width: 296px; float: left; overflow: hidden; }
    
76. .sideR { width: 202px; float: right; overflow: hidden; }
    + x, F. L& }: r5 J2 C1 b
77. /*中间部分样式*/
    
78. .mainarea { margin: 0 4px; width: 382px; float: left; }
    ! f7 g0 _% F" l
79.         .contentL .mainarea { margin: 0 0 0 4px; width: 556px; }
    
80.         .contentR .mainarea { margin: 0 4px 0 0; width: 576px; }
    
81. 
    0 k9 E' D" ~7 G( D3 k2 a) w" L
82. /*-----------------------------------------------------------------------------------版块样式*/
    0 S7 N* D! J" @& p/ J
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. /*头条信息*/
    
90. #headline { padding: 5px; height: 70px; he\ight: 58px; overflow: hidden; }
    . k3 A  X2 K7 z2 _5 ~. r! T
91.         #headline strong { font-size: 1.2em; }
    
92.         #headline p { margin: 0.3em 0; }
    $ P% T4 ?6 I+ v1 e3 }- |/ Y! }
93.         #headline img { float: right; width: 48px; height: 48px; border: 4px solid #FFF; }
    : |4 W0 s) ?/ K- n8 @
94. 
    # T& r- o2 G/ S6 e
95. /*侧边版块*/
    
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; } /*简单版块*/
    - J1 m* y! T) j/ H% F: h
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%; } /**/
     " V) p! K! s! L+ b- Y
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; }
     
103. 
     
104.         /*侧边多行列表*/
     6 ?- F0 i; r( ^; `* M) |5 f/ ]
105.         .sideblock dl { margin: 0; padding: 5px; background: #FFF; line-height: 1.8em; }
     * ~- u, O" B8 p3 ^
106.                 /*\*/ * html .sideblock dl { position: relative; } /**/
     2 V4 D# o9 T5 P8 f8 x
107.                 .sideblock dt { padding-left: 0.8em; background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.7em; }
     6 ~8 J/ u% m7 N  X7 A. [; I  i
108.                 .sideblock dd { color: #999; margin-left: 0.8em; }
     
109.                         .sideblock dd a { color: #999; }
     8 U4 V3 _6 L7 _% b% a9 g
110. 
     
111. /*单行信息列表*/
     
112. .msgtitlelist { margin: 0; padding: 5px 0; list-style: none; line-height: 1.6em; }
       d0 z2 w- v$ m; }4 ]5 y
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; }
     & Q2 l" ^& }3 s4 H% g$ R! U1 y
114.         .mainarea .msgtitlelist { font-size: 1.2em; }
     
115.         .sideblock .msgtitlelist { background: #FFF; }
     ' P+ B0 ?" R6 V% y% X
116. 
     
117. /*多行信息列表*/
     
118. .messagelist { margin: 5px 0; padding: 0; list-style: none; line-height: 1.6em; }
     
119.         .messagelist li { margin: 5px 0 10px 0;}
     - T3 ^, P$ M2 O1 Z
120.                 .messagelist li h4 { margin: 5px 0; font-size: 1em; line-height: 2em; background: #F0F9FF; }
     4 T4 b6 r* M2 ]
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; }
     ( T2 o2 t' l; p; G' e" k! x
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; }
     ) o1 g! Q9 b  K) g- Z; ~
127.                 .messagelist dd { font-size: 12px; margin: 0; padding-left: 1em; color: #999; }
     9 f2 D' h3 T  h% h/ b
128.                         .messagelist dd a { color: #999; }
     5 p3 G) a4 l( V6 o, Q- I# ~% t
129. 
     
130. /*热门话题*/
     
131. #hottag { overflow: hidden;  }
     + L$ y+ }* p, C  Y
132.         #hottag div { background: #FFF; padding: 0.5em; overflow: hidden; line-height: 1.8em; }
     
133.                 #hottag div { color: #999; overflow: hidden; }
     " K8 y8 P5 k7 o3 w: ?
134.                 #hottag a { margin-right: 0.2em; white-space: nowrap; }
     
135.                         #hottag a em { color: #999; font-style: normal; }
     
136. 
     7 ^  Y5 y& v$ o
137. /*用户面板*/
     ) j3 p  I) g* `! u4 c6 u2 B
138. #userpanel { height: 8.8em; overflow: hidden; }
     + |  O6 g, P- Z
139.         #userpanel form { margin: 5px auto !important; margin: 0 auto; width: 150px; }
     
140.                 #userpanel input { width: 90px; }
     
141.                 #userpanel p { margin: 0.5em 0; }
     / n2 W, \# D7 c6 |$ Y- @2 r. y
142.                 #dologin { float: right; }
     , H. z8 U& L( J& S
143.                 #userpanel form a { line-height: 2em; color: #B353B3; border-right: 1px solid #86B9D6; padding-right: 5px; }
     
144.         /*登录后*/
     & L+ m  B6 r, [2 @: @( B) T
145.         #userpanel li { border-bottom: 1px solid #BBE9FF; background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.8em; padding-left: 12px; }
     
146.                 #userpanel li a { color: #000098; }
     
147. 
     
148. /*空间之星*/
     & K3 e5 `9 b: U( X! D3 _
149. #spacestar ul { width: 168px; margin: 0 4px; padding: 0; height: 235px; }
     8 n7 t& s+ E, h# t- F4 w. X" }
150.         #spacestar li { float: left; display: inline; width: 54px; height: 70px; overflow: hidden; margin: 3px 1px; background: #E2F0F9; text-align: center; }
     3 c* _/ b. `% p/ J& }
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; }
     
156. #cityspace form { width: 10.5em; margin: 0 auto; padding: 5px 0; }
     
157.         #cityspace select { margin: 2px 0; }
     & u+ d  O# h. U
158.         #cityspace button { float: right; margin-top: 4px; width: 3.5em; height: 3.5em; }
     3 x9 r, y* @8 U! `; _
159.         #blogblock #cityspace { margin: 0 0 4px 0; }
     
160. 
     ; U9 \' O8 A$ @6 t8 f* r6 g& |  r
161. /*空间排行*/
     & M% b( y% a' G& D% |  L
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; }
     
164.         #hotspace em { float: right; font-style: normal; font-size: 9px; color: #999; width: 40px; }
     1 t3 V8 }3 c# f' W& Y8 U! o/ m
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; }
     
169.         #hotarticletabs { position: absolute; margin: 0; line-height: 18px; top: 7px!important; top: 8px; right: 10px; }
     
170.                 #hotarticletabs span { background: #86B9D6; float: right; color: #FFF; margin-right: 2px; height: 18px; padding: 0 5px; cursor: pointer; }
     3 g# w# _& s4 G3 m2 _! D/ K
171.                         #hotarticletabs span.active { background: #FFF; color: #333; border: 1px solid #86B9D6; border-bottom: none; }
       Q" }+ T% h1 F6 Z
172.         #hotarticle ul { background: #FFF; margin: 0; padding: 0.5em; list-style: none; line-height: 1.7em; height: 16.5em; overflow: hidden; }
     0 ]' K- z, [, q2 o; E
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; }
     5 y. E3 H! F+ C. B" n2 k+ p
174. 
     7 \8 u: \) i$ p- j% R! l
175. /*图片列表*/
     1 a( t: e: x! T! W
176. .imgthumblist { margin: 0 3px; padding: 0; list-style: none; }
     
177.         /*\*/ * html .imgthumblist { height: 1%; }/**/ *>.imgthumblist { overflow: hidden; }
     
178.                 .imgthumblist li { float: left; display: inline; background: #F0F9FF; width: 108px; height: 163px; width: 100px; he\ight: 155px; overflow: hidden; border: 1px solid #B9D0ED; padding: 3px; margin: 3px; }
     
179.                         .imgthumblist li.list1line { height: 123px; height: 115px; }
     % X" Z1 @/ ?& g+ `" A4 S
180.                         .imgthumblist li.list2line { height: 143px; height: 135px; }
     
181.                         .contentL .imgthumblist li { margin: 0 1px 3px; }
     
182.                         .imgthumblist img { width: 100px; height: 100px; }
       `" E6 P9 E% \" l8 J! y
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; }
     7 i; Y5 @8 V2 e/ m( k
186.                 .throughgallery .imgthumblist li { height: 120px; margin: 3px 1px; }
     . z2 ^. w: ?& ?. u8 t5 g* ~
187. 
     ' h0 @& m0 ]# f7 T4 |
188. /*商品*/
     : S2 r% f/ ?, O& s$ U& g% @+ ~
189. /*\*/ * html .goodsthumblist { height: 1%; } /**/ *>.goodsthumblist { overflow: hidden; }
     1 E2 J, B( M- v- \; ^3 }* Z9 q5 l) E
190.         .goodsthumblist { margin: 0; padding: 3px 0; list-style: none; }
     1 C1 d2 N2 a4 ^5 o) j6 t
191.                 .goodsthumblist li { float: left; width: 90px; height: 100px; text-align: center; }
     
192.                         .goodsthumblist li img { width: 70px; height: 70px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED; }
     
193.                         .goodsthumblist li p { margin: -3px 0 0 !important; margin: 0; height: 1.5em; line-height 1.5em; overflow: hidden; }
     
194. 
     
195. .imgtitlelist { margin: 10px 0; padding: 0; list-style: none; }
     ' P2 N8 C, E' X: L
196.                 .imgtitlelist li { padding-left: 85px; padding-bottom: 5px; margin: 5px 0; border-bottom: 1px solid #E2F0F9; }
     & ?; ?+ H. T  j
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; }
     
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; }
     7 K! [" ?3 s4 g+ @" \, \
203.        
     - \2 b- L" ~6 Y
204. 
     
205. /*栏目区块列表*/
     ) `: k! S1 r0 c
206. .category {  margin: 4px 0 10px 0; }
     7 h! z7 j* m1 T" e
207.         .category h3 { margin: 0 0 5px; font-size: 1.2em; line-height: 1.8em; height: 1.8em; border-bottom: 1px solid #86B9D6; }
     $ C' J. E8 V/ s/ v8 _( c+ x% w
208.                 .category h3 strong { background: #E9ECEF; float: left; padding: 0 8px; }
     * I! x: v; s" Z) w1 w; k7 p8 w
209.                         .category h3 strong a { color: #333; text-decoration: none; }
     / A: t" G: z/ F; A, ^
210.         /*.category ul { background: #FFF; margin: 0; padding: 4px 0 0 0; list-style: none; line-height: 1.6em; }
     : X6 R/ n7 Q' ?; ^. Y
211.                 .category li { padding-left: 0.8em; background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.7em; }
     0 e) j- A4 I' _! w
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; }
     $ C. [  a1 t$ a: r
214. 
     
215. 
     
216. /*-----------------------------------------------------------------------------------首页各版块*/
     0 U5 d( @9 I8 I: u0 ]
217. 
     
218. /*#commendimage { height: 155px; }
     
219. #topicnews { height: 217px; }
     & Q- Q4 n, l. d0 E) t, c; |2 N* h; y% ]
220. #newgoods, #commendgoods { height: 200px; }
     
221. #hotcommentfile, #hotfile, #newlink, #hotlink { height: 220px; }*/
     
222. 
     
223. 
     
224. 
     ! _) S$ I9 ]2 I
225. 
     
226. /*信息列表*/
     
227. .articlelist li { padding-left: 60px; }
     9 G3 b1 d$ ]% c/ l( r: g
228.         .articlelist h4 img { float: left; margin-left: -60px; width: 48px; height: 48px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED; }
     3 F, d/ Y) Q% `3 H' W7 d$ @' k
229. /*.articlelist  h3 a { font-size: 12px; font-weight: normal; margin-left: 1em; color: #B353B3; }
       |8 K% K/ P: {1 h
230.        
     
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; }
     2 E" O4 [: ]4 I  V5 G# s% @8 u9 m
235.                 .articlelist h4 a { color: #000099; }
     4 ^1 \0 `, Z( b' P- ?7 _
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; }
     
239.                         .articlelist li strong a { color: #999; }
     ) Q- @* ]  U( ?7 L# N4 o
240.                 .articlelist li p { margin: 0.3em 0; line-height: 1.6em; }
     6 Y" b# ]9 h8 f* g
241.                         .articlelist li p a.more { float: none !important; }*/
     / B  u8 a) g( N$ |/ O
242. 
     . o& ?3 X% k- P  [+ V- I. m7 Z
243. 
     
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); }
     9 c+ P* W# H7 P
247.         .catepic p { text-align: left; margin: 0.5em; }
     ; t+ a5 n' ~6 G) d- |& B+ f( y
248. 
     
249. /*专题列表*/
     - V% h+ S( X. h- y1 N
250. #subjectlist { border-color: #86B9D6; padding: 2px; }
     
251.         #subjectlist h3 { border: none; background: #9FC8DF; }
     ) ^9 W1 k5 D4 ^. J5 n% }2 R
252.         #subjectlist li { border-bottom: 1px solid #E2F0F9; text-align: center; padding: 3px; }
     
253.                 #subjectlist p { margin: 0; line-height: 1.2em; }
     2 W  h5 Y" J- u# g
254. 
     
255. 
     " S% V6 l$ C( Z# d% G+ S
256.         #xspace-rates { height: 2em; }
     ' G$ c' w9 _# i1 F
257.                 #xspace-rates label { float: left; line-height: 24px; margin-right: 5px; }
     ! k  u9 \1 c! V* R( 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; }
       u$ ?: t$ R4 K. |: r
261. 
     ) O* v6 d5 o0 ]( U( ~
262. 
     
263. #panel { width: 600px; overflow: hidden; margin: 1em auto; }
     ' g! o+ M7 z1 X+ [9 l$ e
264. 
     
265. 
     ! K& E% h7 w$ b% m7 p( R. [
266. /*Pages*/
     $ s, f, T, i; z
267. .pages { text-align: right; border-top: 1px solid #9FC8DF; }
     
268.         /*.pages table { margin: 3px 0 3px auto; text-align: center; }
     5 x; v- R+ d" b5 q+ C% W& |8 y  W
269.                 .pages td { padding: 0 5px; border: 1px solid #B9D0ED; background: #FFF; }
     2 j% k/ _- N/ @
270.                 .pages a { text-decoration: none; }
     # N6 x4 o* k. ?* ~0 l
271.                 .pages .currentpage { background: #F0F9FF; border-color: #86B9D6; font-weight: bold; }*/
     8 e" P8 K7 }* c$ e7 }
272. 
     
273. /* 分页 */
     : P3 @3 x+ f- m  a6 C7 z9 _7 {
274. .xspace-page { margin: 2px 2px 2px auto; }
     
275.         table.xspace-page a { display: block; background: #E2F0F9; padding: 0.3em 0.5em; text-decoration: none; }
     8 ^* R" }$ J% k7 U% c1 H, j5 a- }
276.                 table.xspace-page a:hover { background: #86B9D6; }
     1 Q' e8 {4 W  W5 e! X" s
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. 
     - t% {4 t) N6 N+ R0 @
280. .smalltxt { font-size: 12px; color: #999; font-weight: normal; }
     ' j* b0 ?* k8 N! z
281.         .smalltxt a, .smalltxt a:visited { color: #999 !important; }
     
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; }
     
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; }
     1 g& E6 C: D* m
288.        
     
289. .imglogolist { margin: 0; padding: 0; list-style: none; text-align: center; }
     
290.        
     $ G$ ]6 S& r$ N$ r# a
291. #articledetail { border: 1px solid #86B9D6; text-align: center; }
     0 }/ y2 w  b  U6 P7 h3 S- ?9 R2 q" |
292. .articletitle { font-size: 1.6em; margin: 1em 0 0.5em; }
     7 `( }+ ?+ Z& M. h! i) u
293. .articleinfo { border-bottom: 1px solid #9FC8DF; margin: 0;}
     
294. .articlectrl { margin: 0.5em 0 1.5em; }
     
295. 
     
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; }
     9 @0 Z& h' s1 j+ `/ D4 s8 N7 R3 j
298.                 #articlebody  p, #articlebody  div { line-height: 1.8em !important; margin: 10px 0; }
     * n: x' M9 o/ I# P1 [. m( Z4 s
299.                         #articlebody  p *, #articlebody  div * { line-height: normal !important; }
     ! s% f: W9 R, v
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; }
     $ ]9 I. c& d" X( C
303.                 #articlebody .addoninfo ul { margin: 0.5em 0 0.5em 2em; padding: 0; }
     
304.                         #articlebody .addoninfo li { line-height: 1.6em !important; }
     / s! v' k' j' V# b' }5 g
305.        
     
306.         #articlebody img { width: expression(this.width > 500 ? 500: true); max-width: 500px;  }
     
307.        
     
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); }
     * K8 P5 @9 e' Q
312.                         #commentlist .messagelist li div { width: 98%; margin: 0 auto; overflow: hidden; text-align: left; overflow-y: hidden; line-height: 1.8em; }
     1 V0 g4 b$ O  _- i+ G* l
313.                                 #commentlist .messagelist li div * { line-height: normal; }
     
314.                                         #commentlist .messagelist li div  p, #commentlist .messagelist li div  div { line-height: 1.8em !important; margin: 10px 0; }
     
315.                                                 #commentlist .messagelist li div  p *, #commentlist .messagelist li div  div * { line-height: normal !important; }
     
316. 
     
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; }
     " U7 O# g" ?2 Y) T) F; _
323.         #xspace-rates { height: 2em; }
     ' ]3 q: Z6 i. O6 F2 Y2 V, D
324.                 #xspace-rates label { float: left; line-height: 24px; margin-right: 5px; }
     
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*/
     ' o' F: K2 |4 l- J9 E
330. .xspace-ajaxdiv { position:absolute; padding: 5px; border: 1px solid #BBB; background: #FCFFEF; text-align: left; }
     
331.         .xspace-ajaxdiv h5 { line-height: 24px; font-size: 1em; margin: 0; }
     
332.                 .xspace-ajaxdiv h5 a { float: right; font-weight: normal; }
     , O/ b! |. U+ m1 L
333.         .xspace-ajaxcontent { background: #FFF; border: 1px solid #EEE; }
     * e  C) h) w( S
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; }
   9 ]3 n4 a0 T' n' k
4. #wrap { background: #FFF; margin: 0 auto; text-align: left; width: 910px; padding: 0 4px; w\idth: 910px; }
   
5. 
   

复制代码

$ b8 R9 V, X5 v1 g8 t) f  q' j分析

: S, X' P$ D) [9 v% G, X9 \

1. margin属性说明：
   . _9 a$ Y7 }+ O! |- M) E) P1 M: y
2. 
   
3. 检索或设置对象四边的外延边距。
   # b/ n. Z4 u' M- C' A' n1 \% m
4. 如果提供全部四个参数值，将按上－右－下－左的顺序作用于四边。
   1 N$ D( y" T4 K$ L
5. 如果只提供一个，将用于全部的四边。
   
6. 如果提供两个，第一个用于上－下，第二个用于左－右。
   5 H; l$ c% S" T. Y5 L$ z
7. 如果提供三个，第一个用于上，第二个用于左－右，第三个用于下。
   - u# {2 c. `+ d, K
8. 内联对象要使用该属性，必须先设定对象的height或width属性，或者设定position属性为absolute。
   
9. 在IE4+，margin属性不可用于td和tr对象。
   : _7 c  y, d6 s. Y  o
10. 外延边距始终透明。
    7 L3 b, ^  l9 t  ?0 {7 j
11. 
    ( w6 N+ M2 K- j2 k) |4 r4 L
12. color : 　指定颜色
    
13. text-align:文本的对齐方式。(left : 　左对齐,right : 　右对齐,center : 　居中,justify : 　两端对齐)
    & z( `% M& d. K2 ^
14. font: 12px Arial, Helvetica, sans-serif;  :这段是字体相关的
    
15. 
    8 u# h" M# o4 z* d% o# Z) B, J
16. 
    

复制代码

傲天♂浪子追风

1. /*链接样式*/
   
2. a { color: #000; text-decoration: none; }
   
3.         a:hover { text-decoration: underline; color: #000098; }
   5 p$ g9 M" k( V  G; q* y. G5 @% w+ j
4.                 a:visited { color: #666;}
   : d5 f; r( p' ]0 v+ R
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; }
   
8. li cite { font-style: normal; font-size: 12px; float: right; width: 4em; color: #999; }
   
9.         li cite a { color: #999; }
   + W" G" L8 ~* A* Y, n
10.                 li cite a:visited { color: #999; }
    + O* v: q: J; |6 ?- @% w. }
11. .more { float: right !important; color: #000098 !important; background: transparent !important; font-size: 12px !important; font-weight: normal !important; cursor: pointer; }
    
12. 
    , h$ t; m# \1 {$ f+ K+ _

复制代码

2 p0 S* h1 d. |4 q' J0 h
分析

! C2 y7 z- G8 e* r6 k3 l

1. 
   " {0 ?- [+ Y- i7 b) ]4 n# V4 Y* u
2. text-decoration:文本连接的属性,一般有以下几种参数:
   ! }# H9 ~6 i8 J/ U6 E- m3 N: D
3. none : 　无装饰
   
4. blink : 　闪烁
   
5. underline : 　下划线
   
6. line-through : 　贯穿线
   
7. overline : 　上划线
   
8. 
   
9. 
   
10. hover:设置对象在其鼠标悬停时的样式表属性。
    
11. 
      u. r- W9 Q' r" U0 F3 O$ G# l9 }: ]
12. visited:对象在其链接地址已被访问过时的样式表属性。
    
13. 
    7 V; p5 j5 P9 J" r$ b
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; }:
    5 t3 C; F" Z$ D4 H% [! A; j" s
16. 上面这两行是与鼠标相关
    9 W; f- k4 `; _5 V; D0 k. l# M
17. 
    
18. a img { border: none; }图片连接相关
    
19. 
    . R" ]# e1 d% Y7 ~: O
20. 
    
21. cite:这个一般是引用标签的时候用的,不知道用来这里做什么
    
22. 
    1 b5 H. m' ~& ?
23. 
    " {" w0 P9 y/ L
24. font-style:字体式样,一般常用参数有:
    
25. normal : 正常的字体
    
26. italic : 斜体。对于没有斜体变量的特殊字体，将应用oblique
    7 _8 {/ j$ R+ L' p4 j. e" M8 V. i; f
27. oblique : 倾斜的字体
    + Z( P4 I% u7 d& {! g
28. 
    
29. 
    5 o% u. q+ \9 Z' T# B& Z
30. float: right 该属性的值指出了对象是否浮动及如何浮动。常用参数如下:
    
31. none : 　对象不浮动
    
32. left : 　对象浮在左边
    
33. right : 　对象浮在右边
    
34. 
    2 Z1 s7 U1 d6 w- Z
35. 
    
36. important:样式表条目,提升指定样式规则的应用优先权。
    
37. 
    
38. 
    
39. background: transparent 这个的意思就是背景透明...
    6 m" P" d" r+ M, I
40. 
    
41. 
    
42. 
    4 {3 A0 P# G. B0 q2 Z2 _
43. font-weight: normal :文本字体的粗细,常用参数如下:
    ; M$ g8 z2 s4 Y* I% ?
44. normal : 正常的字体。相当于number为400。声明此值将取消之前任何设置
      e" s9 A/ c, ?+ `' r. R; \  D& S
45. bold : 粗体。相当于number为700。也相当于b对象的作用
    
46. bolder : IE5+　特粗体
    . l6 [9 r9 A# b5 I: {& \
47. lighter : IE5+　细体
    
48. number : IE5+　100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
    
49. 
    # {/ b/ ?1 f# n6 d: o9 J* Y  g2 P
50. cursor: pointer:这个是鼠标放在对象中的状态,简单点来可以这样说,也就是鼠标放在连接上的时候显示的鼠标形状,一般有以下N种参数,这个真的是TMD的多啊
    - X4 ]# u: z1 Y# A+ M0 Z
51. 语法：(每一竖隔开为一个状态)
    
52. cursor : auto | crosshair | default | hand | move | help | wait | text | w-resize |s-resize | n-resize |e-resize | ne-resize |sw-resize | se-resize | nw-resize |pointer | url (url)
    
53. 
    
54. 
    
55. 
    ) I: c$ D7 w% F6 H3 f* S
56. 
    ( c* ?$ G4 F) }! I" N1 m' p
57. 
    ; K8 r% t8 i' _
58. 
    
59. 
    

复制代码

傲天♂浪子追风

1. /*-----------------------------------------------------------------------------------表单通用样式*/
   1 I% }: N0 A  W
2. 
   ( N5 y9 c6 @& }4 W( r/ L5 @
3. form { margin: 0; }
   5 C) z3 b! ^2 ?7 {! |0 e- g
4.         input, textarea, button, select { font: 1em Arial, Helvetica, sans-serif; }
   " a7 L! p3 j9 P
5.         button { height: 1.8em; padding: 0 0.3em; background: #9FC8DF; cursor: pointer; border: 1px solid;
   5 j: P! h; R1 J8 i: s/ r
6.                 border-top-color: #C9E3F0; border-right-color: #2A8ABA; border-bottom-color: #2A8ABA; border-left-color: #C9E3F0; }
   , j: m5 v" y1 q; p7 N
7.         fieldset { border: 0; padding: 0; }
   4 l2 S) o  ?& J1 j# ]
8.                 legend { display: none; }
     U9 B. _& I2 z' k% S# I
9.         label { cursor: pointer; margin-right: 0.5em; }
   ! B+ ^# n  Y% x

复制代码

bronwen

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

傲天♂浪子追风

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

傲天♂疯紫

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