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

傲天♂浪子追风

1. * { word-break: break-all; } /*在IE中实行强制换行*/
   8 \7 b+ |/ Q: I0 U
2. #newsblock { margin-top: 4px; }
   
3. /*-----------------------------------------------------------------------------------综合设置*/
   ) \3 K+ A7 g! V( v1 ]
4. 
   - o( B/ W2 ?7 |  v7 S
5. body { margin: 0; background: #FFF; color: #333; text-align: center; font: 12px Arial, Helvetica, sans-serif; }
   % M1 e' P+ c2 `$ O
6. #wrap { background: #FFF; margin: 0 auto; text-align: left; width: 910px; padding: 0 4px; w\idth: 910px; }
   2 V: p0 j" u  r
7. 
   
8. /*链接样式*/
   
9. a { color: #000; text-decoration: none; }
   
10.         a:hover { text-decoration: underline; color: #000098; }
    
11.                 a:visited { color: #666;}
    
12.         #topmenu a, #menu a, .imglist a, #hotspace li a { text-decoration: none; }
    
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; }
    ; o# s$ Z( p8 x, F: b+ [' Z4 P" F
16.         li cite a { color: #999; }
    
17.                 li cite a:visited { color: #999; }
    # K) e7 d4 o! K- s1 J
18. .more { float: right !important; color: #000098 !important; background: transparent !important; font-size: 12px !important; font-weight: normal !important; cursor: pointer; }
    $ E3 l6 t/ `3 s* R9 |' r* @/ U
19. 
    2 S( ^/ k* ~* A  Z. \9 U+ p
20. /*-----------------------------------------------------------------------------------表单通用样式*/
    
21. 
    9 R2 J0 s/ Q, P7 |; ^; h' M
22. form { margin: 0; }
    8 Q/ H/ p0 a0 k4 n
23.         input, textarea, button, select { font: 1em Arial, Helvetica, sans-serif; }
    
24.         button { height: 1.8em; padding: 0 0.3em; background: #9FC8DF; cursor: pointer; border: 1px solid;
    1 A* y7 q" G7 c$ b2 |/ U/ y  k
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; }
    % a. {& v' R5 `% Z
28.         label { cursor: pointer; margin-right: 0.5em; }
    6 t3 d( V7 q$ C% E
29. 
    
30. /*-----------------------------------------------------------------------------------头部风格 Header*/
    
31. /*顶部导航*/
    . p3 \+ j$ j; Z: B; \/ S5 h" 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; }
    8 e" `/ ]! ?0 h) e5 X3 }3 {) C
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; }
    
36. 
    : P( G6 Q& g5 \% g
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; }
    + H/ E  ]* k8 @; d
39.         .banner468 { float: right; }
    
40. 
    
41. /*主导航*/
    
42. #menu { border-top: 2px solid #86B9D6; border-bottom: 1px solid #86B9D6; line-height: 25px; background: url(../images/new/menu_bg.gif); width: 910px; overflow: hidden; }
    
43.         #menu ul { list-style: none; margin: 0 1em; padding: 0; width: 100%; overflow: hidden; }
    2 N# I1 m  i; ^# m9 I% g
44.                 #menu li { float: left; margin: 0 2px; width: 6em; overflow: hidden; white-space: nowrap; }
    
45.         /*首页导航*/
    & S) H' Q+ D5 ^7 o& W8 ~% b
46.         #menu dl { margin: 0 1.5em; padding: 0; height: 25px; overflow: hidden; }
    ) n( F5 c% m3 ]* Q
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; }
    ; `3 s# x& D6 R
50. 
    
51. /*您的位置导航*/
    
52. #navigation { padding: 1.2em 0; }
    
53.         #navigation p { margin: 0;}
    
54.                 #navigation p a, #navigation p strong { margin: 0 0.5em; }
    
55.         #searchform { float: right; }
    
56.                 #searchform * { vertical-align: top; }
    - G" L/ d8 X8 S3 ], z6 _) `  n
57.                 #searchform button { margin-left: 0.5em; }
    
58. 
    4 d/ q2 Y( z+ h; _; N& c
59.         #navigation.simplepage { padding: 0; border-top: 2px solid #009DEA; border-bottom: 1px solid #009DEA; line-height: 25px; background: #EFF5FF; margin-bottom: 1em; }
    " w# e" ^; q: T! F: w2 o6 v
60.                 #navigation.simplepage p { float: right; margin-right: 0.5em; }
    
61.                 .simplepage h2 { margin: 0; font-size: 1.2em; padding-left: 0.5em; }
    / }" [# Y' [: \
62. 
    
63. /*-----------------------------------------------------------------------------------布局*/
    
64. 
    ( e0 B9 y! ]6 x  c
65. .content { /*三列布局*/
    3 ]8 M! l+ x5 ]8 p7 X8 }$ j2 e
66.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y 0 0; }
    $ T$ m" N0 c& [9 d  i6 v2 j$ E
67.         /*\*/ * html .content { height: 1%; } /**/ *>.content { overflow: hidden; }
    
68. .contentL { /*两列布局，侧边在左侧*/
    
69.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y -590px 0; }
    $ R/ |* @- }# w3 M& W8 D
70.         /*\*/ * html .contentR { height: 1%; } /**/ *>.contentR { overflow: hidden; }
    
71. .contentR { /*两列布局，侧边在右侧*/
    
72.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y 580px 0; }
    " r% [3 y, m& v: l# C5 D6 }. C
73.         /*\*/ * html .contentR { height: 1%; } /**/ *>.contentR { overflow: hidden; }
    
74. /*侧边样式*/
    + g* c* r. L8 Z0 k- e! u7 V
75. .sideL { width: 296px; float: left; overflow: hidden; }
    3 S. P, i. M% A9 [; z/ J
76. .sideR { width: 202px; float: right; overflow: hidden; }
    1 f7 }+ t3 G4 U0 o
77. /*中间部分样式*/
    
78. .mainarea { margin: 0 4px; width: 382px; float: left; }
    
79.         .contentL .mainarea { margin: 0 0 0 4px; width: 556px; }
    , ^" W* r1 e' L: ?3 N; m
80.         .contentR .mainarea { margin: 0 4px 0 0; width: 576px; }
    6 L8 B. ]& F5 ]* c, P8 Q3 ~7 p
81. 
    
82. /*-----------------------------------------------------------------------------------版块样式*/
    ! Q1 i* a" A% s8 D! o6 a7 }7 N7 H
83. 
    
84. /*版块标题*/
    8 I5 Z( g5 \! C  U  i
85. .blocktitle { clear: both; border: 1px solid #86B9D6; padding: 1px; margin-bottom: 4px; line-height: 30px; }
    , G  P; p$ j" F
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; }
    ) i4 H4 E3 V% B9 E: T
88. 
    
89. /*头条信息*/
    : h% t2 K, A9 D& B- K7 M
90. #headline { padding: 5px; height: 70px; he\ight: 58px; overflow: hidden; }
    2 e7 J0 _* e- M4 [9 Z
91.         #headline strong { font-size: 1.2em; }
    
92.         #headline p { margin: 0.3em 0; }
    
93.         #headline img { float: right; width: 48px; height: 48px; border: 4px solid #FFF; }
      y  g# a4 v' }
94. 
    " k2 {. R! p1 c. Z
95. /*侧边版块*/
    3 c! G7 w2 v( 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; } /*简单版块*/
    & \3 l5 n' B9 j. c: O9 `5 e
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%; } /**/
     4 P# n0 |, g, d3 a0 e
101.                 .sideblock p { margin: 0.3em; line-height: 1.6em; }
     ' X3 Y) Y5 r' b& a) o' Z3 S& v, `7 m
102.                         .headimg { float: right; margin: 5px 0 2px 5px; width: 80px; height: 80px; border: 4px solid #E2F0F9; }
     : F" T0 U; `  ]/ V' w7 x! b/ e
103. 
     + f/ z# N! k4 y/ z
104.         /*侧边多行列表*/
     
105.         .sideblock dl { margin: 0; padding: 5px; background: #FFF; line-height: 1.8em; }
     & k' d1 ?2 V% }, R; `
106.                 /*\*/ * html .sideblock dl { position: relative; } /**/
     . U1 p9 P# Z( a% x9 P2 ^1 T
107.                 .sideblock dt { padding-left: 0.8em; background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.7em; }
     8 q  L5 A4 }% q0 O0 A) q" x1 \
108.                 .sideblock dd { color: #999; margin-left: 0.8em; }
     + s  r- `8 _8 y6 i
109.                         .sideblock dd a { color: #999; }
     
110. 
     2 Y2 E( Q' C/ e% U4 N! `2 ]
111. /*单行信息列表*/
     4 T+ T. E+ ^  @1 c! d
112. .msgtitlelist { margin: 0; padding: 5px 0; list-style: none; line-height: 1.6em; }
     
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; }
     4 \" q: Q/ M1 c$ H& Q1 u' L0 d
115.         .sideblock .msgtitlelist { background: #FFF; }
     
116. 
     
117. /*多行信息列表*/
     
118. .messagelist { margin: 5px 0; padding: 0; list-style: none; line-height: 1.6em; }
     2 V0 q; w3 ~' z# Y
119.         .messagelist li { margin: 5px 0 10px 0;}
     6 @! L! r, Y2 x% N1 G
120.                 .messagelist li h4 { margin: 5px 0; font-size: 1em; line-height: 2em; background: #F0F9FF; }
     ! W1 A* {0 ^1 J) T6 n2 u' F7 |8 }
121.                         .messagelist li h4 a { color: #009; font-size: 1.2em; }
     
122.                                 .messagelist li h4 a:visited { font-weight: normal; }
     8 z+ {1 l8 d" \4 p5 N
123.                 .messagelist li p { margin: 0; }
     
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; }
     & y; X- F- l! M$ g4 |
127.                 .messagelist dd { font-size: 12px; margin: 0; padding-left: 1em; color: #999; }
     - S+ Q: `: I$ L5 G9 Z9 n- l! Z  s
128.                         .messagelist dd a { color: #999; }
     - R  d( c. [: v8 W4 G
129. 
       s8 M' ^- r) s+ U2 @& L: W
130. /*热门话题*/
     
131. #hottag { overflow: hidden;  }
     
132.         #hottag div { background: #FFF; padding: 0.5em; overflow: hidden; line-height: 1.8em; }
     
133.                 #hottag div { color: #999; overflow: hidden; }
     - [# L9 g: I( G* [0 ?
134.                 #hottag a { margin-right: 0.2em; white-space: nowrap; }
     
135.                         #hottag a em { color: #999; font-style: normal; }
       U. u5 j! ~  P) W3 R/ |
136. 
     $ O$ F& R5 P, U6 z& P/ F5 n5 }
137. /*用户面板*/
     
138. #userpanel { height: 8.8em; overflow: hidden; }
     . g5 V  z/ y) _- I' K
139.         #userpanel form { margin: 5px auto !important; margin: 0 auto; width: 150px; }
     6 N8 h# b/ [/ L/ }! B6 f
140.                 #userpanel input { width: 90px; }
     6 j& s$ g) h/ L- T5 m
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; }
     
144.         /*登录后*/
     7 n4 N; A1 k% ^
145.         #userpanel li { border-bottom: 1px solid #BBE9FF; background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.8em; padding-left: 12px; }
     - a* l% S& t9 `9 \& P$ p8 U: U
146.                 #userpanel li a { color: #000098; }
     
147. 
       C2 f9 _$ K. n% {  c
148. /*空间之星*/
     1 N: ^( v1 @( a/ B4 K5 c7 t
149. #spacestar ul { width: 168px; margin: 0 4px; padding: 0; height: 235px; }
     5 B8 h- D$ w+ ?, h4 Q$ a* Q" I- x
150.         #spacestar li { float: left; display: inline; width: 54px; height: 70px; overflow: hidden; margin: 3px 1px; background: #E2F0F9; text-align: center; }
     " {( G0 w' p. d$ i
151.         #spacestar img { width: 48px; height: 48px; margin-top: 3px; }
     6 ^/ R3 r0 f& j! a9 W
152.         #spacestar p { margin: -4px 0 !important; margin: 0 0; line-height: 20px; height: 20px; }
     
153. 
     
154. /*同城空间*/
     
155. #cityspace { background: #F0F9FF; }
     * f# H/ N3 D* \
156. #cityspace form { width: 10.5em; margin: 0 auto; padding: 5px 0; }
     ( }  N6 V% q( c1 q, H
157.         #cityspace select { margin: 2px 0; }
     3 Q/ N2 [8 W% H) U# N6 p) u
158.         #cityspace button { float: right; margin-top: 4px; width: 3.5em; height: 3.5em; }
     + A7 D% e5 t0 }9 A3 G5 L
159.         #blogblock #cityspace { margin: 0 0 4px 0; }
     % E% G6 W0 u5 T4 r, x
160. 
     
161. /*空间排行*/
     
162. #hotspace ol { margin: 0; padding: 0 0 0 20px; line-height: 20px; background: url(../images/new/hotspace_bg.gif) no-repeat; list-style: none; }
     4 N* _( ^, n  N5 I# F* K
163.         #hotspace li { height: 20px; overflow: hidden; }
     # R. Y. L3 p. @; x
164.         #hotspace em { float: right; font-style: normal; font-size: 9px; color: #999; width: 40px; }
     
165. 
     
166. /*热门文章 */
     
167. #hotarticle { border: 1px solid #86B9D6; background: #E2F0F9; padding: 3px; position: relative; }
     7 I% p0 `9 \1 ]
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; }
     
171.                         #hotarticletabs span.active { background: #FFF; color: #333; border: 1px solid #86B9D6; border-bottom: none; }
     * M# P- S7 F0 M
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 D% L& {8 {& [/ X) L9 z6 r
175. /*图片列表*/
     ; p) U5 A5 k( r! H
176. .imgthumblist { margin: 0 3px; padding: 0; list-style: none; }
     4 Y% ~  r1 e9 h! O
177.         /*\*/ * html .imgthumblist { height: 1%; }/**/ *>.imgthumblist { overflow: hidden; }
     , Y- s4 g$ s& F. H: i+ t
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; }
     " _  N0 ]' q4 Y! w5 _
179.                         .imgthumblist li.list1line { height: 123px; height: 115px; }
     6 V5 W0 f5 @1 Q2 U9 ?2 E
180.                         .imgthumblist li.list2line { height: 143px; height: 135px; }
     - ?- G: f2 ~7 k9 ]
181.                         .contentL .imgthumblist li { margin: 0 1px 3px; }
     - |4 B  F0 W3 X# ?
182.                         .imgthumblist img { width: 100px; height: 100px; }
     
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 u% ]2 m$ X0 v! X+ q9 v6 g' W
186.                 .throughgallery .imgthumblist li { height: 120px; margin: 3px 1px; }
     
187. 
     , n/ Q! \: N6 E' ]- v! d5 g+ V9 h
188. /*商品*/
     
189. /*\*/ * html .goodsthumblist { height: 1%; } /**/ *>.goodsthumblist { overflow: hidden; }
     
190.         .goodsthumblist { margin: 0; padding: 3px 0; list-style: none; }
     : d8 K' z* q: O
191.                 .goodsthumblist li { float: left; width: 90px; height: 100px; text-align: center; }
     ; n  q: T- z; _$ c% l  y/ O, A* V
192.                         .goodsthumblist li img { width: 70px; height: 70px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED; }
     8 y- S' j2 C( w
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; }
     
196.                 .imgtitlelist li { padding-left: 85px; padding-bottom: 5px; margin: 5px 0; border-bottom: 1px solid #E2F0F9; }
     
197.                 /*\*/ * html .imgtitlelist li { height: 1%; } /**/ .imgtitlelist>li { overflow: hidden; }
     8 D. I6 l* p/ F  O7 F! b8 A0 b
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; }
     7 n; z; T: N" Z. u
200.                         .imgtitlelist li p { margin: 0; line-height: 1.5em; }
       E5 ~0 ]3 u5 A
201.         .sideblock .imgtitlelist li { padding-left: 65px; }
     * S1 O: X- N" T
202.                 .sideblock .imgtitlelist li img { width: 48px; height: 48px; margin-left: -60px; }
     
203.        
     . s7 A1 k# A  |: n+ k6 V
204. 
     
205. /*栏目区块列表*/
     - [9 ?; G% F6 B) g
206. .category {  margin: 4px 0 10px 0; }
     ; @9 n  l6 H( A2 j, d( \# s8 {; C9 n
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; }
     * O, `! {/ C. y7 I+ C
209.                         .category h3 strong a { color: #333; text-decoration: none; }
     * _) O0 \' {. x# `; A; M
210.         /*.category ul { background: #FFF; margin: 0; padding: 4px 0 0 0; list-style: none; line-height: 1.6em; }
     , ^* \0 j' d+ N- R- o  a
211.                 .category li { padding-left: 0.8em; background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.7em; }
     / U. s  T4 b% h
212.         .catecommend { background: #F0F9FF; margin: 0; line-height: 2em; height: 2em; overflow: hidden; padding: 0 1em; }*/
     3 v# J6 o$ L7 @" C9 g" Z
213.                 .catecommend a { color: #000099; white-space: nowrap; margin-right: 0.5em; }
     9 n+ _; H, o0 g/ y% d# F
214. 
     4 K* e# i' a" }6 e+ E/ h  x9 e2 O, V! L
215. 
     
216. /*-----------------------------------------------------------------------------------首页各版块*/
     
217. 
     * Q1 b# T' b0 o9 q5 D9 J# {" X
218. /*#commendimage { height: 155px; }
     ; ]+ h) g3 e3 H3 r
219. #topicnews { height: 217px; }
     5 ]- M$ G4 T+ \  Y( ^' b2 W) Z7 P' M
220. #newgoods, #commendgoods { height: 200px; }
       R* n) H9 N$ r8 h3 o* G- y
221. #hotcommentfile, #hotfile, #newlink, #hotlink { height: 220px; }*/
     
222. 
     7 x( N( f9 O9 r# |5 U
223. 
     # g" H6 {* y- L4 [4 {& f8 @: S
224. 
     + b. M8 O4 p/ j: u% K
225. 
     ! |9 F$ \" g5 L' U& j$ p7 C
226. /*信息列表*/
     
227. .articlelist li { padding-left: 60px; }
     ; a( H/ s) b7 F$ _% y
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.        
     8 r. r" j7 A% ]4 I1 t7 d7 w' k
231.         .articlelist ul { margin: 0; padding: 0; background: #FFF; padding-left: 5px; list-style: none; }
     ( a+ i' |$ x; S( i# j) Y
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; }
     7 E2 e0 b1 I0 _2 }. n9 d# m
234.                 .articlelist h4 em { font-style: normal; font-weight: normal; font-size: 0.8em; color: #B353B3; margin-left: 0.3em; }
     
235.                 .articlelist h4 a { color: #000099; }
     
236.                 .articlelist li img { position: absolute; left: 0!important; left: -67px; top: 0; border: 3px solid #9FC8DF; width: 48px; height: 48px; }
     
237.                
     6 S; `) h' |; y) s
238.                 .articlelist li strong { font-weight: normal; color: #999; line-height: 2em; padding-left: 0.5em; }
     
239.                         .articlelist li strong a { color: #999; }
     3 i1 n& v+ l: r3 g! |
240.                 .articlelist li p { margin: 0.3em 0; line-height: 1.6em; }
     
241.                         .articlelist li p a.more { float: none !important; }*/
     8 s0 t' s! s' i  ~8 p) ^( e0 Z
242. 
     ' x0 N7 D4 c2 t2 R  Q* \  X
243. 
     / ~1 Y* k' z  b( s) Y
244. .catepic { text-align: center; }
     * `' d8 P' g, o$ o
245.         .catepic img { margin-top: 10px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED;
     - h5 m" K3 r2 i7 c: j
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; }
     . `- F( n% D' l$ C
248. 
     , s# d3 D4 c6 `& l5 l, b2 y9 i/ a1 C
249. /*专题列表*/
     5 {" \8 h2 s8 k9 d6 u" k
250. #subjectlist { border-color: #86B9D6; padding: 2px; }
     
251.         #subjectlist h3 { border: none; background: #9FC8DF; }
     & A" g. ?! z0 O* y
252.         #subjectlist li { border-bottom: 1px solid #E2F0F9; text-align: center; padding: 3px; }
     : t/ u/ ?$ B" M
253.                 #subjectlist p { margin: 0; line-height: 1.2em; }
     
254. 
     
255. 
     / A  S: d) ^0 h- r
256.         #xspace-rates { height: 2em; }
     ( v: y: f+ C! h3 Y8 J
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; }
     8 t6 Q% m0 _' d. \: L" J. W& z
259.                         #xspace-rates a:hover { border-color: #CCC; }
     ( I2 V4 f# b% f3 k. L
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; }
     ; k8 t  ]: y8 h0 `
261. 
     
262. 
     
263. #panel { width: 600px; overflow: hidden; margin: 1em auto; }
     
264. 
     3 B9 {$ d1 \6 \; o
265. 
     + i. D& E- V& ?' o
266. /*Pages*/
     - F& H% L5 r. ?5 J/ e9 D
267. .pages { text-align: right; border-top: 1px solid #9FC8DF; }
     
268.         /*.pages table { margin: 3px 0 3px auto; text-align: center; }
     # ^. J% [+ `+ E: U5 u
269.                 .pages td { padding: 0 5px; border: 1px solid #B9D0ED; background: #FFF; }
     # w2 G3 ~6 c% g) j* k* |. X+ L
270.                 .pages a { text-decoration: none; }
     
271.                 .pages .currentpage { background: #F0F9FF; border-color: #86B9D6; font-weight: bold; }*/
     
272. 
     
273. /* 分页 */
     8 i6 r- Z0 t$ u) D
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; }
     . Z, T! H4 }# y6 e! [( X5 }" A
276.                 table.xspace-page a:hover { background: #86B9D6; }
     & @  f+ J$ ~- S: I! K
277.         table.xspace-page td.xspace-current { background: #86B9D6; padding: 0.3em 0.5em; font-weight: bold; }
     9 O+ b6 {- O$ M  T! [  ]1 X
278.         table.xspace-page td.xspace-totlerecord, .xspace-page td.xspace-totlepages { background: #E2F0F9; padding: 0.3em 0.5em; }
     9 @/ A  i/ p! U4 B$ u3 C1 u" i3 g
279. 
     7 \) C6 l0 e4 R. j! c0 Z
280. .smalltxt { font-size: 12px; color: #999; font-weight: normal; }
     
281.         .smalltxt a, .smalltxt a:visited { color: #999 !important; }
     4 e  q, p6 i/ m
282. 
     1 p; B4 ?1 b  W$ W, H! b$ w
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; }
     9 D1 Y$ X9 J0 M. X
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 Q2 H' v/ o5 u
288.        
     ' ^( f7 e+ Q3 W. B. P# b4 ~
289. .imglogolist { margin: 0; padding: 0; list-style: none; text-align: center; }
     , \  V: i5 k- l7 K
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;}
     : V+ c( d+ E2 m$ P
294. .articlectrl { margin: 0.5em 0 1.5em; }
     , A7 f9 L' z* A9 ^! d/ l8 F
295. 
     
296.         #articlebody { width: 98%; margin: 0 auto; overflow: hidden; text-align: left; overflow-y: hidden; line-height: 1.8em; font-size: 1.2em; }
     " U5 q8 L: {( k/ f. e
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; }
     
300.        
     
301.         #articlebody .addoninfo { border: 1px solid #EEE; }
     7 C1 \9 P/ b& W8 R
302.                 #articlebody .addoninfo h5 { font-size: 1em; margin: 0; line-height: 2em !important; border-bottom: 1px solid #EEE; padding-left: 1em; }
     
303.                 #articlebody .addoninfo ul { margin: 0.5em 0 0.5em 2em; padding: 0; }
     ; |. X; `$ t5 R
304.                         #articlebody .addoninfo li { line-height: 1.6em !important; }
     3 {' k9 `4 \1 q% |9 m8 `
305.        
     
306.         #articlebody img { width: expression(this.width > 500 ? 500: true); max-width: 500px;  }
     
307.        
     , f! N  ?9 R$ H  V/ I
308.         #articlebody kbd.showvideo, #articlebody kbd.showflash { font: 1em Arial, Helvetica, sans-serif; cursor: pointer; text-decoration: underline; }
     7 Q1 F2 y  C/ r: V2 u/ M
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; }
     % k# \4 @% ^. \* O: X+ m" B* [9 @9 m
311.                                 #commentlist img { max-width: 500px; width: expression(this.width > 500 ? 500: true); }
     
312.                         #commentlist .messagelist li div { width: 98%; margin: 0 auto; overflow: hidden; text-align: left; overflow-y: hidden; line-height: 1.8em; }
     
313.                                 #commentlist .messagelist li div * { line-height: normal; }
     & V8 f9 n4 y, x
314.                                         #commentlist .messagelist li div  p, #commentlist .messagelist li div  div { line-height: 1.8em !important; margin: 10px 0; }
     7 N  }1 V2 s+ t6 [
315.                                                 #commentlist .messagelist li div  p *, #commentlist .messagelist li div  div * { line-height: normal !important; }
     
316. 
     
317. /*发表评论*/
       Z" L4 z8 x) {3 Q  @$ q4 `4 I: {5 a
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; }
     7 X' j" I# Y' B1 [
321.         #comment p { margin: 0.3em 0; }
     
322.         .seccodeline * { vertical-align: middle; }
     
323.         #xspace-rates { height: 2em; }
     1 C- q" x: b4 m6 ?
324.                 #xspace-rates label { float: left; line-height: 24px; margin-right: 5px; }
     0 ]" [  y9 o0 t# E4 |1 }
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; }
     ! u* `3 W8 `# F( ^) I2 h) V
328. 
     2 l; U5 E8 n5 U5 m& S
329. /*AJAX div*/
     
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; }
     ; L+ B- H  }& m4 S. g
332.                 .xspace-ajaxdiv h5 a { float: right; font-weight: normal; }
     
333.         .xspace-ajaxcontent { background: #FFF; border: 1px solid #EEE; }
     
334.                 .xspace-ajaxcontent form { margin: 0; }

复制代码

傲天♂浪子追风

1. /*-----------------------------------------------------------------------------------综合设置*/
   5 Y, K) v& Q  N* J/ D
2. 
   
3. body { margin: 0; background: #FFF; color: #333; text-align: center; font: 12px Arial, Helvetica, sans-serif; }
   # I; {+ i/ _2 S$ a6 K- {
4. #wrap { background: #FFF; margin: 0 auto; text-align: left; width: 910px; padding: 0 4px; w\idth: 910px; }
   2 j8 ]3 K* m8 _8 U% N
5. 
     n7 S" g: B/ A

复制代码

分析

1. margin属性说明：
   8 }! }1 J! |, W: Z/ R0 Q
2. 
   
3. 检索或设置对象四边的外延边距。
   
4. 如果提供全部四个参数值，将按上－右－下－左的顺序作用于四边。
   . x" u. K* h( ^0 b. k2 t2 L$ r
5. 如果只提供一个，将用于全部的四边。
   , y  o% L/ E! ?2 t# p
6. 如果提供两个，第一个用于上－下，第二个用于左－右。
   , J8 Y* ~& }2 h0 H. v3 ?3 T
7. 如果提供三个，第一个用于上，第二个用于左－右，第三个用于下。
   1 P( v, f2 b9 F7 H
8. 内联对象要使用该属性，必须先设定对象的height或width属性，或者设定position属性为absolute。
   7 h8 O$ Q: }1 A1 R4 T" E
9. 在IE4+，margin属性不可用于td和tr对象。
   2 W9 I  S5 Q( o) Z9 G- Q6 V4 H7 G' D  D
10. 外延边距始终透明。
    
11. 
    
12. color : 　指定颜色
    
13. text-align:文本的对齐方式。(left : 　左对齐,right : 　右对齐,center : 　居中,justify : 　两端对齐)
    
14. font: 12px Arial, Helvetica, sans-serif;  :这段是字体相关的
    
15. 
    . l& |+ |: u! h! [
16. 
    8 Z3 O4 D% i( Z* s4 z0 A- c

复制代码

傲天♂浪子追风

1. /*链接样式*/
   
2. a { color: #000; text-decoration: none; }
   
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; }
   - A# N/ q8 A% J- T. Z  H% y' v
7.         a img { border: none; }
   
8. li cite { font-style: normal; font-size: 12px; float: right; width: 4em; color: #999; }
   2 t* r' `" h$ g5 Y5 F8 _
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; }
    ; ^$ i0 d' @5 g+ {' P$ M0 Y+ {
12. 
    

复制代码

& ^( E$ f; T( _1 k: O' z' ~2 |
分析
0 J( e  `" l5 e& x4 D- ^

1. 
   
2. text-decoration:文本连接的属性,一般有以下几种参数:
   
3. none : 　无装饰
   1 y  r7 G) f" U1 l
4. blink : 　闪烁
   3 e# L6 L( a" _) A) I
5. underline : 　下划线
   ( R. j  X# X. R! s, {8 A
6. line-through : 　贯穿线
   
7. overline : 　上划线
   
8. 
   
9. 
   % D" Y0 T2 O2 r) v. q) _9 e. i0 F
10. hover:设置对象在其鼠标悬停时的样式表属性。
    / D2 {8 A" A6 ?, L+ v
11. 
    8 S# K9 }0 x( V- K: I7 }; K, H5 c
12. visited:对象在其链接地址已被访问过时的样式表属性。
    
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. 
    
18. a img { border: none; }图片连接相关
    7 @4 C6 ?" a# y% f; D
19. 
    ) r7 \/ K2 O( U7 n
20. 
    ! f% C* f/ P( Q5 p0 m
21. cite:这个一般是引用标签的时候用的,不知道用来这里做什么
    
22. 
    
23. 
    + |. B% M: ]8 }. _- i' b2 D
24. font-style:字体式样,一般常用参数有:
    
25. normal : 正常的字体
    . B/ C/ V& W7 u7 A0 t; z
26. italic : 斜体。对于没有斜体变量的特殊字体，将应用oblique
    % a& F' P3 {! h
27. oblique : 倾斜的字体
    
28. 
    
29. 
    
30. float: right 该属性的值指出了对象是否浮动及如何浮动。常用参数如下:
    
31. none : 　对象不浮动
    ; W2 a) k( P& w8 v
32. left : 　对象浮在左边
    
33. right : 　对象浮在右边
    " h1 _# I% _+ G/ ~3 M/ R
34. 
    ; N' g# n$ h# @8 }& G
35. 
    - p' h( `! j8 z# r  i# T- Q
36. important:样式表条目,提升指定样式规则的应用优先权。
    5 a; E# E! M; t+ s9 F
37. 
    
38. 
    0 |7 L# G' m" D9 z& k) T
39. background: transparent 这个的意思就是背景透明...
    * s, ]! `- N" [2 q3 ~
40. 
    
41. 
    
42. 
    
43. font-weight: normal :文本字体的粗细,常用参数如下:
    5 }5 Z9 [$ |/ X  w
44. normal : 正常的字体。相当于number为400。声明此值将取消之前任何设置
    ' D4 f- @0 F# n! O- {- K3 Y4 k/ n
45. bold : 粗体。相当于number为700。也相当于b对象的作用
    
46. bolder : IE5+　特粗体
    & ~7 c( a9 o* g
47. lighter : IE5+　细体
    / E! I) ?* ]$ l8 ~
48. number : IE5+　100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
    
49. 
    
50. cursor: pointer:这个是鼠标放在对象中的状态,简单点来可以这样说,也就是鼠标放在连接上的时候显示的鼠标形状,一般有以下N种参数,这个真的是TMD的多啊
    5 I9 N# C2 f/ e, z% E! t
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. 
    * B* T# O+ d" n5 X6 E+ V
56. 
    
57. 
    
58. 
    
59. 
    ! v/ h. u2 C9 N) o' u& E

复制代码

傲天♂浪子追风

1. /*-----------------------------------------------------------------------------------表单通用样式*/
   
2. 
   
3. form { margin: 0; }
   
4.         input, textarea, button, select { font: 1em Arial, Helvetica, sans-serif; }
   
5.         button { height: 1.8em; padding: 0 0.3em; background: #9FC8DF; cursor: pointer; border: 1px solid;
   . D% |. I$ X- Z% X
6.                 border-top-color: #C9E3F0; border-right-color: #2A8ABA; border-bottom-color: #2A8ABA; border-left-color: #C9E3F0; }
   ! m% L0 j+ ?$ T9 K1 h
7.         fieldset { border: 0; padding: 0; }
   : A# n5 ?" v8 V( I
8.                 legend { display: none; }
   
9.         label { cursor: pointer; margin-right: 0.5em; }
   . [5 `0 @' }$ S3 l: V& f! m

复制代码

bronwen

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

傲天♂浪子追风

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

傲天♂疯紫

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