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

傲天♂浪子追风

1. * { word-break: break-all; } /*在IE中实行强制换行*/
   . e5 `8 k4 X, g
2. #newsblock { margin-top: 4px; }
   ) M1 V3 `. e; k& V% I6 z, P
3. /*-----------------------------------------------------------------------------------综合设置*/
   : Q5 B& J- ~: b+ I2 |4 ]
4. 
   ; z. y7 Y  B4 }! p! N1 ?
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; }
   
7. 
     c' b: ^  K; j
8. /*链接样式*/
   6 B) Y; c& ]1 D7 o6 H1 ^
9. a { color: #000; text-decoration: none; }
   
10.         a:hover { text-decoration: underline; color: #000098; }
    3 H8 M* \$ x9 ?
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; }
    
16.         li cite a { color: #999; }
    
17.                 li cite a:visited { color: #999; }
    , ~. M+ t7 r; T- @/ C* |
18. .more { float: right !important; color: #000098 !important; background: transparent !important; font-size: 12px !important; font-weight: normal !important; cursor: pointer; }
    
19. 
    5 ]! p9 |' ?6 ~/ k( Z4 R: L
20. /*-----------------------------------------------------------------------------------表单通用样式*/
    
21. 
    
22. form { margin: 0; }
    * M8 T# s, f7 r6 L0 M! C
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;
    6 f: N7 e4 B# p, H1 ~0 q- A
25.                 border-top-color: #C9E3F0; border-right-color: #2A8ABA; border-bottom-color: #2A8ABA; border-left-color: #C9E3F0; }
    
26.         fieldset { border: 0; padding: 0; }
    
27.                 legend { display: none; }
    
28.         label { cursor: pointer; margin-right: 0.5em; }
    , v' x& R% ~) @7 o3 ~5 K3 q1 V4 D
29. 
    ; f6 {6 \0 O, k! \/ T0 [: y. C% b
30. /*-----------------------------------------------------------------------------------头部风格 Header*/
    
31. /*顶部导航*/
    
32. #topmenu { background: #9FC8DF url(../images/new/title_bg.gif) repeat-x 0 -3px; border-bottom: 4px solid #F5FBFF; border-top: none; text-align: right; line-height: 2em; }
    
33.         #topmenu ul { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid #86B9D6; }
    + Y9 W" ~! C; Z$ g1 E
34.                 #topmenu li { display: inline; border-left: 1px solid #86B9D6; padding-left: 1em; padding-right: 0.5em; }
    7 R: d! ^2 X9 o) m4 B- s9 M
35.                         #topmenu a { color: #154BA0; }
    
36. 
    
37. #pagetitle { padding: 8px 0; height: 76px; he\ight: 60px; border-bottom: 4px solid #F5FBFF; }
    2 v6 |: K6 ]! A/ @  E
38.         #logo { border-right: 1px solid #86B9D6; padding: 0 10px; margin-right: 10px; }
    
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; }
    
44.                 #menu li { float: left; margin: 0 2px; width: 6em; overflow: hidden; white-space: nowrap; }
    
45.         /*首页导航*/
    
46.         #menu dl { margin: 0 1.5em; padding: 0; height: 25px; overflow: hidden; }
    : r* Q" {! L/ `' N9 y0 M
47.                 #menu dt { float: left; width: 4em; white-space: nowrap; }
    # z; y: D- \, R1 y; U' Y6 F
48.                         #menu dt a { color: #000098 !important; }
    # s, T' I  }* I+ j. |
49.                 #menu dd { float: left; width: 6em; margin: 0 2px; overflow: hidden; white-space: nowrap; }
    " Y: a$ B( ], j# ~4 v
50. 
    $ [3 D) O& c3 Z
51. /*您的位置导航*/
    ( I3 B& k' c, d+ ]7 [# Q7 q
52. #navigation { padding: 1.2em 0; }
    ' X5 G# \- R( M+ `
53.         #navigation p { margin: 0;}
    
54.                 #navigation p a, #navigation p strong { margin: 0 0.5em; }
    
55.         #searchform { float: right; }
    0 g" d3 j$ {: m# i
56.                 #searchform * { vertical-align: top; }
    
57.                 #searchform button { margin-left: 0.5em; }
    ; f6 g" G# O2 w* y  Y. \2 r( [" K
58. 
    5 C* |2 i! T+ ]7 R# h# K# m
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; }
    7 q; o- L9 U5 G: R
61.                 .simplepage h2 { margin: 0; font-size: 1.2em; padding-left: 0.5em; }
    
62. 
    * E2 l/ w; C/ E, G1 y& P: R5 Z
63. /*-----------------------------------------------------------------------------------布局*/
    
64. 
    
65. .content { /*三列布局*/
    1 c9 O  x+ n  Y6 w
66.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y 0 0; }
    " k& z6 R6 [$ {$ y
67.         /*\*/ * html .content { height: 1%; } /**/ *>.content { overflow: hidden; }
    
68. .contentL { /*两列布局，侧边在左侧*/
    # I5 ?+ E6 M: x" w) R# A
69.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y -590px 0; }
    3 W) z3 s: x! {! R$ \1 c% X
70.         /*\*/ * html .contentR { height: 1%; } /**/ *>.contentR { overflow: hidden; }
    
71. .contentR { /*两列布局，侧边在右侧*/
    & h" Z9 m) f& ^/ d# e1 d
72.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y 580px 0; }
    
73.         /*\*/ * html .contentR { height: 1%; } /**/ *>.contentR { overflow: hidden; }
    ) c" u& z" C( ?$ u
74. /*侧边样式*/
    9 j, @- h. ?) |" b, U
75. .sideL { width: 296px; float: left; overflow: hidden; }
    
76. .sideR { width: 202px; float: right; overflow: hidden; }
    7 J7 ~; i2 }0 e* {  S, {" s4 @4 V3 f
77. /*中间部分样式*/
    ; G9 M9 c* F! ^* K* j: ?: t4 S
78. .mainarea { margin: 0 4px; width: 382px; float: left; }
    , Z8 u2 W6 @9 B, b
79.         .contentL .mainarea { margin: 0 0 0 4px; width: 556px; }
    + m/ H" \! X. Q: {3 l* e& L
80.         .contentR .mainarea { margin: 0 4px 0 0; width: 576px; }
    
81. 
    
82. /*-----------------------------------------------------------------------------------版块样式*/
    
83. 
    ' c* u, t! B8 Y2 D# a: o
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; }
    
91.         #headline strong { font-size: 1.2em; }
    7 A7 `- F% s! V5 S! Q3 K
92.         #headline p { margin: 0.3em 0; }
    9 {7 Y2 E0 n( K: o$ y4 z% ?
93.         #headline img { float: right; width: 48px; height: 48px; border: 4px solid #FFF; }
    
94. 
    7 n" v  G8 }, k* f2 z7 g
95. /*侧边版块*/
    , F5 i6 A2 B% `9 x
96. .sideblock { margin: 0 0 3px; border: 1px solid #86B9D6; background: #FFF; padding: 3px; }
    / |2 @( B3 h' F  Y; Z
97.         .boldblock { padding: 1px; background: #9FC8DF; } /*突出版块*/
    - h. w+ T  e! Y4 B. S0 P+ G# H
98.         .cleanblock { border: 1px solid #86B9D6; margin: 0 0 4px; padding: 0; background: #F5FBFF; } /*简单版块*/
    , |) P5 N2 C4 |! z
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%; } /**/
     5 m8 _5 [# ~0 h- Q; K
101.                 .sideblock p { margin: 0.3em; line-height: 1.6em; }
     & a( T2 k: f& u3 l* z7 |
102.                         .headimg { float: right; margin: 5px 0 2px 5px; width: 80px; height: 80px; border: 4px solid #E2F0F9; }
     8 \& a/ @: i. h, u" N0 o7 G$ @
103. 
     , B, @1 F$ S1 E: @- {
104.         /*侧边多行列表*/
     " x6 @1 D1 w# x) X& t7 ?: E+ p$ T
105.         .sideblock dl { margin: 0; padding: 5px; background: #FFF; line-height: 1.8em; }
     ) G+ Y4 f4 O5 G" L% `
106.                 /*\*/ * html .sideblock dl { position: relative; } /**/
     0 [2 g5 {) p# Z' Z
107.                 .sideblock dt { padding-left: 0.8em; background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.7em; }
     + U8 z, S- L. Y, c  J6 `
108.                 .sideblock dd { color: #999; margin-left: 0.8em; }
     
109.                         .sideblock dd a { color: #999; }
     
110. 
     
111. /*单行信息列表*/
     
112. .msgtitlelist { margin: 0; padding: 5px 0; list-style: none; line-height: 1.6em; }
     1 o6 v! F$ i8 y$ S) ]/ M
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; }
     & d. O* M6 e& N) s* S8 ^
114.         .mainarea .msgtitlelist { font-size: 1.2em; }
     ) T& Z" v0 {( U" Q
115.         .sideblock .msgtitlelist { background: #FFF; }
     1 j- j* M8 ?+ Y0 D
116. 
     
117. /*多行信息列表*/
     
118. .messagelist { margin: 5px 0; padding: 0; list-style: none; line-height: 1.6em; }
     7 b+ F5 l" u  l# t1 k
119.         .messagelist li { margin: 5px 0 10px 0;}
     ( U8 J( k/ R3 J, x0 _
120.                 .messagelist li h4 { margin: 5px 0; font-size: 1em; line-height: 2em; background: #F0F9FF; }
     
121.                         .messagelist li h4 a { color: #009; font-size: 1.2em; }
     
122.                                 .messagelist li h4 a:visited { font-weight: normal; }
     & e. N, t1 n/ ?1 V
123.                 .messagelist li p { margin: 0; }
     
124. 
     5 P4 n$ S: }& n* ?( m* I% l4 w
125.         .messagelist dl { margin: 0; padding: 0; line-height: 1.6em; }
     $ |6 `4 Z" r8 y! }: Y: v
126.                 .messagelist dt { background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.7em; padding-left: 0.8em; }
     
127.                 .messagelist dd { font-size: 12px; margin: 0; padding-left: 1em; color: #999; }
     
128.                         .messagelist dd a { color: #999; }
     
129. 
     
130. /*热门话题*/
     : D3 D4 a& {9 W! _9 G; j
131. #hottag { overflow: hidden;  }
     
132.         #hottag div { background: #FFF; padding: 0.5em; overflow: hidden; line-height: 1.8em; }
     ! N5 R7 H0 Z3 o) a4 I! D
133.                 #hottag div { color: #999; overflow: hidden; }
     
134.                 #hottag a { margin-right: 0.2em; white-space: nowrap; }
     
135.                         #hottag a em { color: #999; font-style: normal; }
     , g9 w; {5 s+ e) w+ ~- u# M" o
136. 
     + T8 ?' l/ H  P
137. /*用户面板*/
     - [8 D6 E4 @4 T' V
138. #userpanel { height: 8.8em; overflow: hidden; }
     ' B& @% x3 A( h) l2 r
139.         #userpanel form { margin: 5px auto !important; margin: 0 auto; width: 150px; }
     ) ]# W/ o2 T1 H7 z, n5 C
140.                 #userpanel input { width: 90px; }
     
141.                 #userpanel p { margin: 0.5em 0; }
       e/ X& i  f" e9 o& r3 B( J
142.                 #dologin { float: right; }
     
143.                 #userpanel form a { line-height: 2em; color: #B353B3; border-right: 1px solid #86B9D6; padding-right: 5px; }
     . y( j) j$ l( L
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; }
     $ t. S0 P6 g3 D; e
147. 
     
148. /*空间之星*/
     * }. T1 I0 e' a
149. #spacestar ul { width: 168px; margin: 0 4px; padding: 0; height: 235px; }
     , A, F) |( I* w, G6 E
150.         #spacestar li { float: left; display: inline; width: 54px; height: 70px; overflow: hidden; margin: 3px 1px; background: #E2F0F9; text-align: center; }
     8 j% l4 E* \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; }
     2 E" [5 e; j  L
156. #cityspace form { width: 10.5em; margin: 0 auto; padding: 5px 0; }
     $ C0 _9 n, V  R$ m5 ^
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. /*空间排行*/
     7 L0 l* r" |4 j9 x* G  p5 Y7 \
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; }
     0 D5 W4 H- i7 F
164.         #hotspace em { float: right; font-style: normal; font-size: 9px; color: #999; width: 40px; }
     
165. 
     ' Y% t* r% `5 j% C
166. /*热门文章 */
     : f8 H6 X( z4 F8 Y7 M
167. #hotarticle { border: 1px solid #86B9D6; background: #E2F0F9; padding: 3px; position: relative; }
     , j8 C6 {/ L7 q" d
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; }
     ; T: e# h) _: E7 I
171.                         #hotarticletabs span.active { background: #FFF; color: #333; border: 1px solid #86B9D6; border-bottom: none; }
     
172.         #hotarticle ul { background: #FFF; margin: 0; padding: 0.5em; list-style: none; line-height: 1.7em; height: 16.5em; overflow: hidden; }
     ) ]  N- T- D# R6 F9 |& 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; }
     ; q  t* L9 n  p) G( w
174. 
     / S5 c& a% H( F- T, K* m. c% r: q
175. /*图片列表*/
     " M" f+ H3 w( N7 F2 \
176. .imgthumblist { margin: 0 3px; padding: 0; list-style: none; }
     
177.         /*\*/ * html .imgthumblist { height: 1%; }/**/ *>.imgthumblist { overflow: hidden; }
     & Z; @$ Z; [& m& v
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; }
     + I& g! N; Y, g8 _1 ~) P
180.                         .imgthumblist li.list2line { height: 143px; height: 135px; }
       w! b- O4 W0 L
181.                         .contentL .imgthumblist li { margin: 0 1px 3px; }
     0 I; ?- v: ^4 l5 O
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; }
     
186.                 .throughgallery .imgthumblist li { height: 120px; margin: 3px 1px; }
     7 S) V6 w; H% G1 h6 B6 |
187. 
     3 ~  s' g8 h; U
188. /*商品*/
     0 k2 A. o0 R, u
189. /*\*/ * html .goodsthumblist { height: 1%; } /**/ *>.goodsthumblist { overflow: hidden; }
     - X( e. c! e5 Z1 e7 k
190.         .goodsthumblist { margin: 0; padding: 3px 0; list-style: none; }
     
191.                 .goodsthumblist li { float: left; width: 90px; height: 100px; text-align: center; }
     ) Z' ]$ A3 l4 c! v. j  n
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; }
     / n" a9 J5 L9 c( e4 L) ]
196.                 .imgtitlelist li { padding-left: 85px; padding-bottom: 5px; margin: 5px 0; border-bottom: 1px solid #E2F0F9; }
     ; _' B+ z, O/ ^/ [
197.                 /*\*/ * html .imgtitlelist li { height: 1%; } /**/ .imgtitlelist>li { overflow: hidden; }
     2 {* H8 E* l5 o, ~
198.                         .imgtitlelist li h4 { margin: 0.3em 0; font-size: 1em; }
       k3 l. x9 e- s  Y% E; n
199.                         .imgtitlelist li img { float: left; margin-left: -85px; width: 70px; height: 70px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED; }
     # E2 K' ?: {! D' Z$ x) b6 t4 p
200.                         .imgtitlelist li p { margin: 0; line-height: 1.5em; }
     5 \& ?2 \. G6 i& H9 W3 A& ~
201.         .sideblock .imgtitlelist li { padding-left: 65px; }
     . M# b% y& Q- @. E. h9 }6 D
202.                 .sideblock .imgtitlelist li img { width: 48px; height: 48px; margin-left: -60px; }
     
203.        
     
204. 
     ' a0 i9 [) m3 F; V! C4 v' m
205. /*栏目区块列表*/
     1 x1 A& S; `" X% {! i: w
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; }
     7 y, h+ h3 z  h; K4 g
209.                         .category h3 strong a { color: #333; text-decoration: none; }
     8 I. z9 K& x, u# W2 i' K
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; }
     4 r% W  u# Z. a% 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; }
     - V1 k8 _9 Q  p0 J: P6 f
214. 
     ) g1 v: H1 \+ D' l5 T: Z6 B
215. 
     
216. /*-----------------------------------------------------------------------------------首页各版块*/
     + N. `! I2 _# o- F
217. 
     , S( J) Z1 ~) w, A
218. /*#commendimage { height: 155px; }
     
219. #topicnews { height: 217px; }
     
220. #newgoods, #commendgoods { height: 200px; }
     
221. #hotcommentfile, #hotfile, #newlink, #hotlink { height: 220px; }*/
     # D2 q2 d' _# t8 K7 i
222. 
     
223. 
     
224. 
     
225. 
     
226. /*信息列表*/
     
227. .articlelist li { padding-left: 60px; }
     3 I* d9 i2 P3 B1 {$ q" T& I
228.         .articlelist h4 img { float: left; margin-left: -60px; width: 48px; height: 48px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED; }
     " y0 }$ k5 j/ H/ r
229. /*.articlelist  h3 a { font-size: 12px; font-weight: normal; margin-left: 1em; color: #B353B3; }
     3 n, P& H3 r. K9 T
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; }
     * \, n! d. [3 ^
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; }
     7 e. V; x: T: s( Q
237.                
     
238.                 .articlelist li strong { font-weight: normal; color: #999; line-height: 2em; padding-left: 0.5em; }
     # W0 [" _! U( N8 p) W
239.                         .articlelist li strong a { color: #999; }
     
240.                 .articlelist li p { margin: 0.3em 0; line-height: 1.6em; }
     ( Z: }) o# l0 L
241.                         .articlelist li p a.more { float: none !important; }*/
     
242. 
     5 G* E6 u- Y) ^/ q& N0 n
243. 
     4 z) r& d% o" V9 u! i
244. .catepic { text-align: center; }
     9 U) N1 {5 i1 n" J6 s* |
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); }
     % Z( p  `0 O$ }# N. V
247.         .catepic p { text-align: left; margin: 0.5em; }
     $ @8 h4 }; c; h* h7 Z! ]
248. 
     
249. /*专题列表*/
     
250. #subjectlist { border-color: #86B9D6; padding: 2px; }
     - W. ?2 b- s- n/ v/ ?" I/ W) j
251.         #subjectlist h3 { border: none; background: #9FC8DF; }
     
252.         #subjectlist li { border-bottom: 1px solid #E2F0F9; text-align: center; padding: 3px; }
       N9 [/ s6 V* H& @! f  t  P: g
253.                 #subjectlist p { margin: 0; line-height: 1.2em; }
     7 A. D  L; f- {/ b; P6 y
254. 
     
255. 
     7 o; ]6 [% f$ p; z
256.         #xspace-rates { height: 2em; }
     + u% v5 x& [8 L& y7 I
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; }
     
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; }
     ) X' S# W/ y2 ~2 p' z  N
261. 
     $ U1 [0 V; ?7 i  B, v' w) ]
262. 
     
263. #panel { width: 600px; overflow: hidden; margin: 1em auto; }
     2 C5 O8 c" P: j. A( c6 J) O* q
264. 
     
265. 
     + M, ^( j8 l7 W
266. /*Pages*/
     
267. .pages { text-align: right; border-top: 1px solid #9FC8DF; }
     9 f* n2 Y) r7 ]' F: A
268.         /*.pages table { margin: 3px 0 3px auto; text-align: center; }
     
269.                 .pages td { padding: 0 5px; border: 1px solid #B9D0ED; background: #FFF; }
     ( d$ Y: i4 k, M* }/ F
270.                 .pages a { text-decoration: none; }
     
271.                 .pages .currentpage { background: #F0F9FF; border-color: #86B9D6; font-weight: bold; }*/
     + D; t( e# P+ |$ Q8 o- {0 ^+ A
272. 
     
273. /* 分页 */
     4 ^4 P: A' n2 a4 I  N% _
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; }
     - R  Q" j+ u0 ]/ t2 {9 T
276.                 table.xspace-page a:hover { background: #86B9D6; }
     6 X# i& b: Q" w+ W" t  ?
277.         table.xspace-page td.xspace-current { background: #86B9D6; padding: 0.3em 0.5em; font-weight: bold; }
     
278.         table.xspace-page td.xspace-totlerecord, .xspace-page td.xspace-totlepages { background: #E2F0F9; padding: 0.3em 0.5em; }
     
279. 
     
280. .smalltxt { font-size: 12px; color: #999; font-weight: normal; }
     
281.         .smalltxt a, .smalltxt a:visited { color: #999 !important; }
     
282. 
     0 m  R0 ?! m% z+ y  Z3 b* ]
283. /*-----------------------------------------------------------------------------------页脚 Footer*/
     5 {, c+ h7 d8 L" o
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; }
     8 C0 w+ w9 i1 l6 w" f
285.         #footer p { margin: 0.3em 0; color: #999; }
     
286.         #footer strong { color: #007AB6; }
     " a+ ^& W. R8 v, K# r
287.         #footer em { font-style: normal; font-weight: bold; color: #96A800; }
     
288.        
     
289. .imglogolist { margin: 0; padding: 0; list-style: none; text-align: center; }
     % T  O9 M& X7 m% c3 `
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;}
     
294. .articlectrl { margin: 0.5em 0 1.5em; }
     ( M( o1 z7 p) D
295. 
     / u6 y/ `/ _" `( O+ Z
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; }
     & U$ K0 V- ]* p" K( W0 N
298.                 #articlebody  p, #articlebody  div { line-height: 1.8em !important; margin: 10px 0; }
     
299.                         #articlebody  p *, #articlebody  div * { line-height: normal !important; }
     ' w1 O% ?) ]; X1 @$ U. Y
300.        
     / u* b8 O, b" y
301.         #articlebody .addoninfo { border: 1px solid #EEE; }
     
302.                 #articlebody .addoninfo h5 { font-size: 1em; margin: 0; line-height: 2em !important; border-bottom: 1px solid #EEE; padding-left: 1em; }
     
303.                 #articlebody .addoninfo ul { margin: 0.5em 0 0.5em 2em; padding: 0; }
     , i( J& U! t/ f+ a3 P6 f
304.                         #articlebody .addoninfo li { line-height: 1.6em !important; }
     5 {: M4 Q. B, |$ I* t& B2 K2 ~3 K
305.        
     8 l# h3 A& m) Z, f. y$ r
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; }
     ' \& b! O  G5 T  I
309.         #commentlist { overflow: hidden; border: 1px solid #86B9D6; margin: 4px 0 0; padding: 0 5px; }
     , R+ @: c6 K: B9 s$ r
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); }
     8 q) r# {# q+ c
312.                         #commentlist .messagelist li div { width: 98%; margin: 0 auto; overflow: hidden; text-align: left; overflow-y: hidden; line-height: 1.8em; }
     # n: ^& k1 q  \* l% T
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; }
     . \3 a! }8 b0 S) K
316. 
     * R; ]: h" t$ ?: \
317. /*发表评论*/
     2 u. I/ x( `$ ]
318. #comment { margin-top: 4px; }
     1 m2 ^! N3 d6 f5 i& x$ [& \
319.         #comment h3 { margin: 0 5px; font-size: 1em; line-height: 2em; }
     1 m1 G) H+ x; B( N! Q4 U8 c
320.         #comment form { background: #FFF; margin: 0; padding: 5px; }
     
321.         #comment p { margin: 0.3em 0; }
     
322.         .seccodeline * { vertical-align: middle; }
     
323.         #xspace-rates { height: 2em; }
     ' x& X* K9 W0 s
324.                 #xspace-rates label { float: left; line-height: 24px; margin-right: 5px; }
     1 u& |5 K) S/ b8 _- C# y
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; }
     , R1 T- B' f9 ^7 c5 _3 u
326.                         #xspace-rates a:hover { border-color: #CCC; }
     # T8 \) j/ N+ ?. _' u5 `% z
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. 
     5 ~; N: l8 w$ N1 z+ H
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; }
     / [% b; F/ E* C+ |2 Q  @
332.                 .xspace-ajaxdiv h5 a { float: right; font-weight: normal; }
     
333.         .xspace-ajaxcontent { background: #FFF; border: 1px solid #EEE; }
     2 z% k* M$ I, `; i6 r
334.                 .xspace-ajaxcontent form { margin: 0; }

复制代码

傲天♂浪子追风

1. /*-----------------------------------------------------------------------------------综合设置*/
   
2. 
   ( V7 ?) n; Q% \( R
3. body { margin: 0; background: #FFF; color: #333; text-align: center; font: 12px Arial, Helvetica, sans-serif; }
   $ i7 p; I" f+ g7 C: ?& Z; g
4. #wrap { background: #FFF; margin: 0 auto; text-align: left; width: 910px; padding: 0 4px; w\idth: 910px; }
   
5. 
   1 f, [( f- u  }: H, Z5 G" B

复制代码

/ `& m" s/ |& X/ F3 G* a& Q分析

1. margin属性说明：
   
2. 
   
3. 检索或设置对象四边的外延边距。
   
4. 如果提供全部四个参数值，将按上－右－下－左的顺序作用于四边。
   2 s+ |  ^' h" `0 I3 {9 _
5. 如果只提供一个，将用于全部的四边。
   
6. 如果提供两个，第一个用于上－下，第二个用于左－右。
   # V& z% C- _6 j  |# q! ~8 D  S) P
7. 如果提供三个，第一个用于上，第二个用于左－右，第三个用于下。
   
8. 内联对象要使用该属性，必须先设定对象的height或width属性，或者设定position属性为absolute。
   * Y- u, J6 O; u3 @9 E
9. 在IE4+，margin属性不可用于td和tr对象。
   / U* E2 x9 t% {8 {4 l- E4 L
10. 外延边距始终透明。
    / R: V( O. e% s
11. 
    
12. color : 　指定颜色
    
13. text-align:文本的对齐方式。(left : 　左对齐,right : 　右对齐,center : 　居中,justify : 　两端对齐)
    " o/ v- ~7 }  H
14. font: 12px Arial, Helvetica, sans-serif;  :这段是字体相关的
    # ?! V, O! Q- V3 v! Y+ a6 G
15. 
    * n; g, t  O$ a9 ^6 j' g
16. 
    

复制代码

傲天♂浪子追风

1. /*链接样式*/
   
2. a { color: #000; text-decoration: none; }
   ( x, m1 C. y# x2 B; i& ]
3.         a:hover { text-decoration: underline; color: #000098; }
   % v6 Z. v' Q- N2 i, t' m
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; }
   8 j4 F9 |+ m6 M2 R: Z
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; }
   ' i" L9 }! e2 }7 I# d6 P
10.                 li cite a:visited { color: #999; }
    : n* Z# }3 f; u
11. .more { float: right !important; color: #000098 !important; background: transparent !important; font-size: 12px !important; font-weight: normal !important; cursor: pointer; }
    
12. 
    ! ~, \9 W3 h. Y' i1 P

复制代码

7 e( k6 x, z# \% {0 Z( x
4 k/ r7 ]/ N4 F( [1 B分析

! D  b% z" c+ b" g" j: s1 m

1. 
   % T4 G' j) D& n6 B( ?& A
2. text-decoration:文本连接的属性,一般有以下几种参数:
   
3. none : 　无装饰
   / q) \& x2 e# r; g6 d
4. blink : 　闪烁
   
5. underline : 　下划线
   4 w, M+ l- A5 E/ z
6. line-through : 　贯穿线
   ' e9 d9 q8 O& L' {
7. overline : 　上划线
   1 s9 H. u, J( ?; D6 _" s
8. 
   . r% @- E$ N& _  d/ ]' Y% r
9. 
   1 y% h; F+ ^9 j* A/ s1 P
10. hover:设置对象在其鼠标悬停时的样式表属性。
    
11. 
    
12. visited:对象在其链接地址已被访问过时的样式表属性。
    
13. 
    ( S' \' O! g- Z: g
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. 
    & C0 @5 ^* b# M
18. a img { border: none; }图片连接相关
    
19. 
    
20. 
    . w; H# d! N4 `# G( K4 T6 L
21. cite:这个一般是引用标签的时候用的,不知道用来这里做什么
    
22. 
    & D) k( \& }. z: o4 @6 {/ U
23. 
    
24. font-style:字体式样,一般常用参数有:
    
25. normal : 正常的字体
    ( Z! p+ p6 |: U8 N" f4 J
26. italic : 斜体。对于没有斜体变量的特殊字体，将应用oblique
    . F7 V8 O$ X+ |/ P
27. oblique : 倾斜的字体
    8 o) L7 i3 D$ U* l2 V% B- |
28. 
    + M' k) k2 \: K
29. 
    
30. float: right 该属性的值指出了对象是否浮动及如何浮动。常用参数如下:
    
31. none : 　对象不浮动
    ; `0 Q/ G: O5 m
32. left : 　对象浮在左边
    ; z. y  c- {0 \# m; l' \, K
33. right : 　对象浮在右边
    
34. 
    2 E, B3 {% X% }  |! K2 d
35. 
    
36. important:样式表条目,提升指定样式规则的应用优先权。
    5 S; G/ [# B+ i& D# O; s
37. 
    
38. 
    8 }- v% P: W+ b5 j
39. background: transparent 这个的意思就是背景透明...
    $ N  I# X8 [7 C+ H5 A1 K
40. 
    : m! A) d! X" C# ]& A
41. 
    0 J% n2 c  |/ l- ^/ _0 L
42. 
    0 n# v8 G2 x- l: d5 |
43. font-weight: normal :文本字体的粗细,常用参数如下:
    4 g0 p* V" x. m" G
44. normal : 正常的字体。相当于number为400。声明此值将取消之前任何设置
    
45. bold : 粗体。相当于number为700。也相当于b对象的作用
    
46. bolder : IE5+　特粗体
    
47. lighter : IE5+　细体
    
48. number : IE5+　100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
    
49. 
    
50. cursor: pointer:这个是鼠标放在对象中的状态,简单点来可以这样说,也就是鼠标放在连接上的时候显示的鼠标形状,一般有以下N种参数,这个真的是TMD的多啊
    
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. 
    ! L9 c7 F+ d4 D+ t9 J$ S
54. 
    9 r7 c9 g$ A  M" i
55. 
    
56. 
    
57. 
    1 i* o9 B' x3 L" r9 b
58. 
    
59. 
    

复制代码

傲天♂浪子追风

1. /*-----------------------------------------------------------------------------------表单通用样式*/
   . p9 U/ {* C. W1 I7 s* T# A
2. 
   8 q) Z2 c1 @9 \/ N" B( B; |0 u
3. form { margin: 0; }
   
4.         input, textarea, button, select { font: 1em Arial, Helvetica, sans-serif; }
   
5.         button { height: 1.8em; padding: 0 0.3em; background: #9FC8DF; cursor: pointer; border: 1px solid;
   
6.                 border-top-color: #C9E3F0; border-right-color: #2A8ABA; border-bottom-color: #2A8ABA; border-left-color: #C9E3F0; }
     W6 l5 c+ J' w$ ^( R5 }
7.         fieldset { border: 0; padding: 0; }
   
8.                 legend { display: none; }
     G$ x8 j- Z" r1 Z8 K
9.         label { cursor: pointer; margin-right: 0.5em; }
   : C7 d$ x  m# x" U2 x; u6 G9 b, @

复制代码

bronwen

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

傲天♂浪子追风

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

傲天♂疯紫

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