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

傲天♂浪子追风

1. * { word-break: break-all; } /*在IE中实行强制换行*/
   
2. #newsblock { margin-top: 4px; }
   
3. /*-----------------------------------------------------------------------------------综合设置*/
   
4. 
   
5. body { margin: 0; background: #FFF; color: #333; text-align: center; font: 12px Arial, Helvetica, sans-serif; }
   9 g0 g# e8 k0 n4 j' K* a3 c. |$ H4 e* r
6. #wrap { background: #FFF; margin: 0 auto; text-align: left; width: 910px; padding: 0 4px; w\idth: 910px; }
   ! Y! @3 ~# ^2 [$ i' D/ n' [
7. 
   ! c9 g7 k, K7 f2 A# S( `
8. /*链接样式*/
   - I: A/ ?1 v  |- W9 d3 e1 Z" x& F
9. a { color: #000; text-decoration: none; }
   
10.         a:hover { text-decoration: underline; color: #000098; }
    % u2 K1 H5 ^# y
11.                 a:visited { color: #666;}
    
12.         #topmenu a, #menu a, .imglist a, #hotspace li a { text-decoration: none; }
    5 K1 `/ c- c) a2 {& \4 h0 ?
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; }
    ! K: w6 l; I: {- a2 ]0 r3 H; R
16.         li cite a { color: #999; }
    
17.                 li cite a:visited { color: #999; }
    % `- s+ X% F$ T/ w
18. .more { float: right !important; color: #000098 !important; background: transparent !important; font-size: 12px !important; font-weight: normal !important; cursor: pointer; }
    
19. 
    % I# N+ Z0 ^3 v; _
20. /*-----------------------------------------------------------------------------------表单通用样式*/
    ! ?$ {8 P9 F0 c9 X- Y2 K
21. 
    
22. form { margin: 0; }
    
23.         input, textarea, button, select { font: 1em Arial, Helvetica, sans-serif; }
    , i8 V0 q) d+ H8 m3 ^5 E% v3 ?0 {
24.         button { height: 1.8em; padding: 0 0.3em; background: #9FC8DF; cursor: pointer; border: 1px solid;
    3 W+ W, e$ x) Q% [7 F! [" e5 q
25.                 border-top-color: #C9E3F0; border-right-color: #2A8ABA; border-bottom-color: #2A8ABA; border-left-color: #C9E3F0; }
    * [! l' e. A" A6 h3 I  [& K* E
26.         fieldset { border: 0; padding: 0; }
    
27.                 legend { display: none; }
    
28.         label { cursor: pointer; margin-right: 0.5em; }
    
29. 
    & d/ ?) f( o) C( _' V
30. /*-----------------------------------------------------------------------------------头部风格 Header*/
    
31. /*顶部导航*/
    6 \- L! P( a# c/ e4 n  v1 F5 p
32. #topmenu { background: #9FC8DF url(../images/new/title_bg.gif) repeat-x 0 -3px; border-bottom: 4px solid #F5FBFF; border-top: none; text-align: right; line-height: 2em; }
    
33.         #topmenu ul { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid #86B9D6; }
    
34.                 #topmenu li { display: inline; border-left: 1px solid #86B9D6; padding-left: 1em; padding-right: 0.5em; }
    
35.                         #topmenu a { color: #154BA0; }
    
36. 
    + r' v9 u6 C" S; U9 A5 p/ g
37. #pagetitle { padding: 8px 0; height: 76px; he\ight: 60px; border-bottom: 4px solid #F5FBFF; }
    & i( q9 i% r  f: a
38.         #logo { border-right: 1px solid #86B9D6; padding: 0 10px; margin-right: 10px; }
    
39.         .banner468 { float: right; }
    
40. 
    % G) T" c# h! [% _; h- c
41. /*主导航*/
    ) W/ C6 V# S9 [4 f6 ^
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; }
    4 P7 J- C- ?; T" g1 `& Y. w" Z
44.                 #menu li { float: left; margin: 0 2px; width: 6em; overflow: hidden; white-space: nowrap; }
    $ G# e- g- K8 |# U$ [9 z
45.         /*首页导航*/
    ! ^# f1 ?# H3 \; V% r
46.         #menu dl { margin: 0 1.5em; padding: 0; height: 25px; overflow: hidden; }
    
47.                 #menu dt { float: left; width: 4em; white-space: nowrap; }
    # N( p5 N' u. E1 `: I& J
48.                         #menu dt a { color: #000098 !important; }
    
49.                 #menu dd { float: left; width: 6em; margin: 0 2px; overflow: hidden; white-space: nowrap; }
    * v7 T8 t. X6 j& x+ g, L; i- V
50. 
    
51. /*您的位置导航*/
    3 J6 U8 J5 A) z% c( E& p' r( a2 \
52. #navigation { padding: 1.2em 0; }
    
53.         #navigation p { margin: 0;}
    6 I; y) `& z) ^+ z, i7 _3 J9 S% Z
54.                 #navigation p a, #navigation p strong { margin: 0 0.5em; }
    
55.         #searchform { float: right; }
    # q: u4 J% o: W6 n. A- r9 j2 d
56.                 #searchform * { vertical-align: top; }
    : T9 ^; L0 K" u1 g% j: O4 ^' U1 {
57.                 #searchform button { margin-left: 0.5em; }
    
58. 
    
59.         #navigation.simplepage { padding: 0; border-top: 2px solid #009DEA; border-bottom: 1px solid #009DEA; line-height: 25px; background: #EFF5FF; margin-bottom: 1em; }
    - I4 w" T: b+ [# W7 W% o) l
60.                 #navigation.simplepage p { float: right; margin-right: 0.5em; }
    3 c& u* S9 c  m/ m. j2 G9 w: C
61.                 .simplepage h2 { margin: 0; font-size: 1.2em; padding-left: 0.5em; }
    
62. 
    
63. /*-----------------------------------------------------------------------------------布局*/
    8 a3 g5 P5 d" T+ {) z
64. 
    
65. .content { /*三列布局*/
    
66.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y 0 0; }
    ) I5 T- v( A7 z# M/ {
67.         /*\*/ * html .content { height: 1%; } /**/ *>.content { overflow: hidden; }
    - E$ `0 d- D( _' a; n8 S" t8 C
68. .contentL { /*两列布局，侧边在左侧*/
    0 B1 a- [0 m) H2 h
69.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y -590px 0; }
    # F5 y+ E5 L: D+ R
70.         /*\*/ * html .contentR { height: 1%; } /**/ *>.contentR { overflow: hidden; }
    - k2 A! v$ n) D2 v) U9 H! E
71. .contentR { /*两列布局，侧边在右侧*/
    
72.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y 580px 0; }
    
73.         /*\*/ * html .contentR { height: 1%; } /**/ *>.contentR { overflow: hidden; }
    2 X; G8 {" w! I- D- Y
74. /*侧边样式*/
    # @, B2 z& c- O8 k0 }8 J
75. .sideL { width: 296px; float: left; overflow: hidden; }
    
76. .sideR { width: 202px; float: right; overflow: hidden; }
    & e& u: Y- p. h$ e+ {
77. /*中间部分样式*/
    9 h0 n7 L& I/ M  D+ M
78. .mainarea { margin: 0 4px; width: 382px; float: left; }
    1 @  J1 e) u1 ^+ e$ ?
79.         .contentL .mainarea { margin: 0 0 0 4px; width: 556px; }
    ; d0 Z7 K! G# U
80.         .contentR .mainarea { margin: 0 4px 0 0; width: 576px; }
    8 g) r! B& o( t' T4 n* x  z0 m
81. 
    " |" A$ _" O4 Y9 X
82. /*-----------------------------------------------------------------------------------版块样式*/
    
83. 
    ) S+ V- c$ w# W7 u, ^% ]; ^4 D$ I
84. /*版块标题*/
    - d# h+ ^: S) o5 ~7 w1 B5 X' i3 Q
85. .blocktitle { clear: both; border: 1px solid #86B9D6; padding: 1px; margin-bottom: 4px; line-height: 30px; }
    7 O( B& n+ \, G$ j% O- b
86.         .blocktitle h2 { font-size: 1.2em; margin: 0; padding: 0 5px; background: #9FC8DF url(../images/new/title_bg.gif) repeat-x; }
    
87.         .blocktitle .more { margin-right: 5px; }
      ?. O/ v$ q6 r" {$ F4 X1 [* G
88. 
    
89. /*头条信息*/
    & {$ r' {% W8 `
90. #headline { padding: 5px; height: 70px; he\ight: 58px; overflow: hidden; }
    % l+ @; ~3 e/ M1 K* B
91.         #headline strong { font-size: 1.2em; }
    
92.         #headline p { margin: 0.3em 0; }
    5 m$ ^9 D* {- V: k
93.         #headline img { float: right; width: 48px; height: 48px; border: 4px solid #FFF; }
    
94. 
    ' x9 J1 g2 ~4 F& d& O% e$ ~
95. /*侧边版块*/
    
96. .sideblock { margin: 0 0 3px; border: 1px solid #86B9D6; background: #FFF; padding: 3px; }
    
97.         .boldblock { padding: 1px; background: #9FC8DF; } /*突出版块*/
    ) t0 s0 F  y  c! A0 l5 U4 i
98.         .cleanblock { border: 1px solid #86B9D6; margin: 0 0 4px; padding: 0; background: #F5FBFF; } /*简单版块*/
    
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%; } /**/
     / E& {: U# b/ g
101.                 .sideblock p { margin: 0.3em; line-height: 1.6em; }
     - @' k! }2 c& c* |3 {4 b
102.                         .headimg { float: right; margin: 5px 0 2px 5px; width: 80px; height: 80px; border: 4px solid #E2F0F9; }
     
103. 
     
104.         /*侧边多行列表*/
     3 T8 [5 v( Q, R7 o
105.         .sideblock dl { margin: 0; padding: 5px; background: #FFF; line-height: 1.8em; }
     ) D# s8 d$ p; J
106.                 /*\*/ * html .sideblock dl { position: relative; } /**/
     2 I9 A) x& J" [7 J( E1 W. V
107.                 .sideblock dt { padding-left: 0.8em; background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.7em; }
     
108.                 .sideblock dd { color: #999; margin-left: 0.8em; }
     ; N3 Q4 F  B) A2 p
109.                         .sideblock dd a { color: #999; }
     
110. 
     
111. /*单行信息列表*/
     
112. .msgtitlelist { margin: 0; padding: 5px 0; list-style: none; line-height: 1.6em; }
     4 k4 x0 I4 L! G$ I! E( c
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; }
     1 a0 r. m) R% d) s
114.         .mainarea .msgtitlelist { font-size: 1.2em; }
     
115.         .sideblock .msgtitlelist { background: #FFF; }
     
116. 
     " N1 g: f6 x0 ^/ X$ X9 [, A4 q
117. /*多行信息列表*/
     
118. .messagelist { margin: 5px 0; padding: 0; list-style: none; line-height: 1.6em; }
     7 J2 S) g5 J- }+ t' S
119.         .messagelist li { margin: 5px 0 10px 0;}
     
120.                 .messagelist li h4 { margin: 5px 0; font-size: 1em; line-height: 2em; background: #F0F9FF; }
     
121.                         .messagelist li h4 a { color: #009; font-size: 1.2em; }
     4 Y# o& C# n3 ]& u0 U
122.                                 .messagelist li h4 a:visited { font-weight: normal; }
     + d' Z+ O( C, D6 J5 [
123.                 .messagelist li p { margin: 0; }
     7 o2 J. B8 j. h8 V4 P: P& o) z
124. 
     
125.         .messagelist dl { margin: 0; padding: 0; line-height: 1.6em; }
     1 B( U3 T' A4 x% l! z) D# 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. 
     3 ]$ X) D& A/ W3 z6 w9 k
130. /*热门话题*/
     . z5 O) E5 r6 ^' h1 m; n
131. #hottag { overflow: hidden;  }
     
132.         #hottag div { background: #FFF; padding: 0.5em; overflow: hidden; line-height: 1.8em; }
     ! Q& q! l( ^. _8 d& R( Y0 q: V6 c0 F
133.                 #hottag div { color: #999; overflow: hidden; }
     
134.                 #hottag a { margin-right: 0.2em; white-space: nowrap; }
     # n. ~6 P& s* c
135.                         #hottag a em { color: #999; font-style: normal; }
     2 V" z3 _7 O# S% M  s5 E- i. W4 a
136. 
     8 ]7 l! j. ^( K* C
137. /*用户面板*/
     + q0 b) j& t8 P0 f
138. #userpanel { height: 8.8em; overflow: hidden; }
     ! n+ o' u1 y9 I  d* [* E$ 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; }
     ' e2 C) L* N) X( S. Y
142.                 #dologin { float: right; }
     
143.                 #userpanel form a { line-height: 2em; color: #B353B3; border-right: 1px solid #86B9D6; padding-right: 5px; }
     
144.         /*登录后*/
     6 H, }1 F' }5 w' K/ m* x2 g
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. 
     / U, q. \. G) s
148. /*空间之星*/
     
149. #spacestar ul { width: 168px; margin: 0 4px; padding: 0; height: 235px; }
     
150.         #spacestar li { float: left; display: inline; width: 54px; height: 70px; overflow: hidden; margin: 3px 1px; background: #E2F0F9; text-align: center; }
     
151.         #spacestar img { width: 48px; height: 48px; margin-top: 3px; }
     1 [: R- ^2 y4 E/ a: q0 Y3 I
152.         #spacestar p { margin: -4px 0 !important; margin: 0 0; line-height: 20px; height: 20px; }
     5 A: |, k) K5 ^" Y1 v
153. 
     
154. /*同城空间*/
     0 i; n+ L2 J" I& N; t9 r
155. #cityspace { background: #F0F9FF; }
     
156. #cityspace form { width: 10.5em; margin: 0 auto; padding: 5px 0; }
     * y8 P$ z7 ?" Q) X
157.         #cityspace select { margin: 2px 0; }
     + ^& C1 D5 ?5 U- \# \, t
158.         #cityspace button { float: right; margin-top: 4px; width: 3.5em; height: 3.5em; }
     7 d. v& O+ [  Z4 `: k
159.         #blogblock #cityspace { margin: 0 0 4px 0; }
     
160. 
     
161. /*空间排行*/
     ' e9 _" t& o. J; \, M  @* _3 @
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; }
     * z' U+ {, A( |
163.         #hotspace li { height: 20px; overflow: hidden; }
     
164.         #hotspace em { float: right; font-style: normal; font-size: 9px; color: #999; width: 40px; }
     4 u) f( }+ W6 R# @$ H* ?0 }4 K3 `0 S
165. 
     
166. /*热门文章 */
     - E* t$ O. ~0 x* r9 B
167. #hotarticle { border: 1px solid #86B9D6; background: #E2F0F9; padding: 3px; position: relative; }
     " c5 T3 o2 B7 a% h. u
168.         #hotarticle h3 { font-size: 1.2em; margin: 0; line-height: 22px; border-bottom: 1px solid #86B9D6; }
     + _: ?1 I$ x& m& e. G
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; }
     
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. 
     6 t" L! |* ^" q0 w8 T
175. /*图片列表*/
     + O' z1 Z& S9 ?8 Q* _
176. .imgthumblist { margin: 0 3px; padding: 0; list-style: none; }
     ; s5 [. l8 F& ]+ h
177.         /*\*/ * html .imgthumblist { height: 1%; }/**/ *>.imgthumblist { overflow: hidden; }
     & P( e1 W( g' ]
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; }
     0 x' k/ S6 Y6 P
179.                         .imgthumblist li.list1line { height: 123px; height: 115px; }
     
180.                         .imgthumblist li.list2line { height: 143px; height: 135px; }
     
181.                         .contentL .imgthumblist li { margin: 0 1px 3px; }
     0 c" v; a) Z7 r; z9 U8 D
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; }
     
187. 
     
188. /*商品*/
     
189. /*\*/ * html .goodsthumblist { height: 1%; } /**/ *>.goodsthumblist { overflow: hidden; }
     * m# Y$ _. R1 l% q8 e* r: X
190.         .goodsthumblist { margin: 0; padding: 3px 0; list-style: none; }
     9 s5 z2 X, m: E$ A! ~$ K  v) g: u
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; }
     + |+ G8 X6 k& y( D1 S. l' N; \" C
194. 
     ; ^* D! r# {: Z* s+ Y, B
195. .imgtitlelist { margin: 10px 0; padding: 0; list-style: none; }
     3 b( {+ ?3 c6 h/ W2 e
196.                 .imgtitlelist li { padding-left: 85px; padding-bottom: 5px; margin: 5px 0; border-bottom: 1px solid #E2F0F9; }
     / L- v) w8 k8 z! K' z# D
197.                 /*\*/ * html .imgtitlelist li { height: 1%; } /**/ .imgtitlelist>li { overflow: hidden; }
     4 z( g+ y. [; {9 L
198.                         .imgtitlelist li h4 { margin: 0.3em 0; font-size: 1em; }
     , x& z6 x7 V9 a9 l+ Z
199.                         .imgtitlelist li img { float: left; margin-left: -85px; width: 70px; height: 70px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED; }
     & f: t8 a! Y% z) l* W
200.                         .imgtitlelist li p { margin: 0; line-height: 1.5em; }
     4 ^" [( N; @: W
201.         .sideblock .imgtitlelist li { padding-left: 65px; }
     
202.                 .sideblock .imgtitlelist li img { width: 48px; height: 48px; margin-left: -60px; }
     
203.        
     
204. 
     
205. /*栏目区块列表*/
     
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; }
     / Z( K4 e8 q$ l5 ?
209.                         .category h3 strong a { color: #333; text-decoration: none; }
     
210.         /*.category ul { background: #FFF; margin: 0; padding: 4px 0 0 0; list-style: none; line-height: 1.6em; }
     1 A$ p5 w& `0 X4 L! F' Q, w
211.                 .category li { padding-left: 0.8em; background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.7em; }
     
212.         .catecommend { background: #F0F9FF; margin: 0; line-height: 2em; height: 2em; overflow: hidden; padding: 0 1em; }*/
     1 Q/ u, D" P, m1 x' J: Y
213.                 .catecommend a { color: #000099; white-space: nowrap; margin-right: 0.5em; }
     
214. 
     0 b6 e: W7 L% E5 Y1 w
215. 
     
216. /*-----------------------------------------------------------------------------------首页各版块*/
     $ F3 k$ c1 m" d* @# C0 C: `
217. 
     
218. /*#commendimage { height: 155px; }
     ; ^) r' ^' j  \" L! a5 c: F& {
219. #topicnews { height: 217px; }
     ; X5 i' s6 @/ D- P% ^
220. #newgoods, #commendgoods { height: 200px; }
     0 I8 U4 ^2 w! U- D
221. #hotcommentfile, #hotfile, #newlink, #hotlink { height: 220px; }*/
     6 {& E: L5 N7 t+ U& F6 B6 p$ ^
222. 
     0 \$ o- I4 t- z5 |6 k; ]4 _
223. 
     
224. 
     
225. 
     
226. /*信息列表*/
     " y' o4 k6 z5 o( r4 e
227. .articlelist li { padding-left: 60px; }
     
228.         .articlelist h4 img { float: left; margin-left: -60px; width: 48px; height: 48px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED; }
     
229. /*.articlelist  h3 a { font-size: 12px; font-weight: normal; margin-left: 1em; color: #B353B3; }
     
230.        
     
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; }
     3 `) W  @' f9 {1 c) s0 h" u
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.                
     
238.                 .articlelist li strong { font-weight: normal; color: #999; line-height: 2em; padding-left: 0.5em; }
     6 L" h# m! x: s* b4 t( M4 O
239.                         .articlelist li strong a { color: #999; }
     
240.                 .articlelist li p { margin: 0.3em 0; line-height: 1.6em; }
     
241.                         .articlelist li p a.more { float: none !important; }*/
     7 b8 n* U) Y3 C" E6 R- K
242. 
     " ^0 I3 o; a; p/ E% z
243. 
     
244. .catepic { text-align: center; }
     
245.         .catepic img { margin-top: 10px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED;
     : b6 s0 X' l$ h8 A5 A
246.                 max-width: 150px; max-height: 150px; width: expression(this.width > 150 ? 150: true); height: expression(this.height > 150 ? 150: true); }
     : @5 r$ D6 ?" g. g) y
247.         .catepic p { text-align: left; margin: 0.5em; }
     
248. 
     3 Z  b& e3 G+ k9 F8 A, [
249. /*专题列表*/
     
250. #subjectlist { border-color: #86B9D6; padding: 2px; }
     
251.         #subjectlist h3 { border: none; background: #9FC8DF; }
     ) ?- y6 s& r: q( N% y9 O) G
252.         #subjectlist li { border-bottom: 1px solid #E2F0F9; text-align: center; padding: 3px; }
       r. @" c! s' L- U3 d
253.                 #subjectlist p { margin: 0; line-height: 1.2em; }
     
254. 
     
255. 
     
256.         #xspace-rates { height: 2em; }
     
257.                 #xspace-rates label { float: left; line-height: 24px; margin-right: 5px; }
     
258.                 #xspace-rates a { float: left; border: 1px solid #EEE; text-decoration: none; width: 20px; height: 20px; text-align: center; line-height: 20px; margin: 0 2px; }
     
259.                         #xspace-rates a:hover { border-color: #CCC; }
     
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; }
     
261. 
     . K% L( h& _7 K+ G
262. 
     
263. #panel { width: 600px; overflow: hidden; margin: 1em auto; }
     
264. 
     
265. 
     / O1 q% s( p2 J* i* n5 Z
266. /*Pages*/
     
267. .pages { text-align: right; border-top: 1px solid #9FC8DF; }
     6 n* l* k6 V- Y" X1 J
268.         /*.pages table { margin: 3px 0 3px auto; text-align: center; }
     
269.                 .pages td { padding: 0 5px; border: 1px solid #B9D0ED; background: #FFF; }
     ) g" [9 R, ~! e$ d, p
270.                 .pages a { text-decoration: none; }
     
271.                 .pages .currentpage { background: #F0F9FF; border-color: #86B9D6; font-weight: bold; }*/
     
272. 
     + ~# ?; F+ M! |
273. /* 分页 */
     4 |3 Z. W* n, G! ?* q" T
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; }
     * j- o# S1 Z7 \% t" Q9 D
276.                 table.xspace-page a:hover { background: #86B9D6; }
     4 p4 ], `' h5 Q0 w
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. 
     9 a- _; L5 O) m' V
280. .smalltxt { font-size: 12px; color: #999; font-weight: normal; }
     , G7 s6 x% m2 A' @* @+ w( c
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; }
     + J& [9 ?$ z) _% H
285.         #footer p { margin: 0.3em 0; color: #999; }
     ; U! V: G- W: T- g; F1 w# u1 ]3 o
286.         #footer strong { color: #007AB6; }
     ! e' \" A  x1 ]) }& f
287.         #footer em { font-style: normal; font-weight: bold; color: #96A800; }
     7 Z3 k9 g0 n0 B' q. A, G% I
288.        
     
289. .imglogolist { margin: 0; padding: 0; list-style: none; text-align: center; }
     
290.        
     
291. #articledetail { border: 1px solid #86B9D6; text-align: center; }
     / o2 C& j  P7 \) s
292. .articletitle { font-size: 1.6em; margin: 1em 0 0.5em; }
     ) @; M' ]( ?( S3 K: z0 z! ~% d, l+ }
293. .articleinfo { border-bottom: 1px solid #9FC8DF; margin: 0;}
     + K" r1 R$ B) W1 z6 N1 b! h' H+ p  u
294. .articlectrl { margin: 0.5em 0 1.5em; }
     8 z( g1 Z3 j5 a1 M
295. 
     , Z0 H! _$ K" K6 C
296.         #articlebody { width: 98%; margin: 0 auto; overflow: hidden; text-align: left; overflow-y: hidden; line-height: 1.8em; font-size: 1.2em; }
     & l4 i0 X$ h& \
297.         #articlebody * { line-height: normal; }
     
298.                 #articlebody  p, #articlebody  div { line-height: 1.8em !important; margin: 10px 0; }
     1 u% w5 z: \8 Y
299.                         #articlebody  p *, #articlebody  div * { line-height: normal !important; }
     8 C9 n0 |/ q$ ]4 T, L1 n
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; }
     & r- F# h" X$ e2 Y! w8 Q
303.                 #articlebody .addoninfo ul { margin: 0.5em 0 0.5em 2em; padding: 0; }
     
304.                         #articlebody .addoninfo li { line-height: 1.6em !important; }
     
305.        
     $ G! ^' L6 Q! i/ E8 A/ s+ H( v7 u
306.         #articlebody img { width: expression(this.width > 500 ? 500: true); max-width: 500px;  }
     
307.        
     # V' s; H" I9 p' A7 `! h  E
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); }
     ( F5 h2 N( p. n! i; p' H
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; }
     
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; }
     " ?( [# [4 W- X
316. 
     8 B! u8 t2 @, t4 \7 ^
317. /*发表评论*/
     
318. #comment { margin-top: 4px; }
     
319.         #comment h3 { margin: 0 5px; font-size: 1em; line-height: 2em; }
     2 u+ p3 |  N  S3 ^0 l) o
320.         #comment form { background: #FFF; margin: 0; padding: 5px; }
     
321.         #comment p { margin: 0.3em 0; }
     8 t: \5 U" s) U$ u- \0 c: P; n
322.         .seccodeline * { vertical-align: middle; }
     
323.         #xspace-rates { height: 2em; }
     
324.                 #xspace-rates label { float: left; line-height: 24px; margin-right: 5px; }
     # h% ~0 Y0 Z' s
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; }
     4 x# Z7 Q5 w4 W2 J6 S
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; }
     $ a$ N+ d3 d  v% A, l& f
328. 
       C) H" _, E3 l# L( l" A
329. /*AJAX div*/
     
330. .xspace-ajaxdiv { position:absolute; padding: 5px; border: 1px solid #BBB; background: #FCFFEF; text-align: left; }
     . G* {& J4 o. F4 O& a* v; a% P
331.         .xspace-ajaxdiv h5 { line-height: 24px; font-size: 1em; margin: 0; }
     * d" c# f# k4 f
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. /*-----------------------------------------------------------------------------------综合设置*/
   
2. 
   & a. u1 s3 T% U2 v; N" A
3. body { margin: 0; background: #FFF; color: #333; text-align: center; font: 12px Arial, Helvetica, sans-serif; }
   
4. #wrap { background: #FFF; margin: 0 auto; text-align: left; width: 910px; padding: 0 4px; w\idth: 910px; }
   
5. 
   9 p# z7 G, z$ n$ ]: j: f

复制代码

# q+ K: P# ~) v7 Q1 X分析

7 o4 ?0 ]/ l7 b

1. margin属性说明：
   0 O3 U- I8 o. I8 O2 n
2. 
   2 j9 T# a6 y) Y# t
3. 检索或设置对象四边的外延边距。
   ' ]5 O5 v+ M4 p2 i
4. 如果提供全部四个参数值，将按上－右－下－左的顺序作用于四边。
   0 c) U) y  w# ]+ B, H
5. 如果只提供一个，将用于全部的四边。
   
6. 如果提供两个，第一个用于上－下，第二个用于左－右。
   
7. 如果提供三个，第一个用于上，第二个用于左－右，第三个用于下。
   
8. 内联对象要使用该属性，必须先设定对象的height或width属性，或者设定position属性为absolute。
   
9. 在IE4+，margin属性不可用于td和tr对象。
   
10. 外延边距始终透明。
    6 A8 M# Q1 F0 m6 q8 [, l
11. 
    
12. color : 　指定颜色
    ! p( l6 }4 Z, {9 q
13. text-align:文本的对齐方式。(left : 　左对齐,right : 　右对齐,center : 　居中,justify : 　两端对齐)
    
14. font: 12px Arial, Helvetica, sans-serif;  :这段是字体相关的
    $ G# [$ a. S9 D* n( k
15. 
    ' A8 F" @4 B) b: E/ }1 b
16. 
    9 W! i# Q7 B! ?6 T+ p! P5 C# V  A' E

复制代码

傲天♂浪子追风

1. /*链接样式*/
   " N! o2 S6 f3 a' e; A) t' `! O
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; }
   ! P1 z- a0 v  _- z# R7 e" J
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; }
   
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; }
    
12. 
    

复制代码

9 _% j. I# x5 X& {# B. A  o分析
3 y1 r! S1 O( b

1. 
   
2. text-decoration:文本连接的属性,一般有以下几种参数:
   
3. none : 　无装饰
   , `. x5 T1 u' N8 A4 a; l
4. blink : 　闪烁
   6 j* B( g! E7 W* p
5. underline : 　下划线
   
6. line-through : 　贯穿线
   
7. overline : 　上划线
   * l& A1 O( ?6 f/ v* @6 e. R
8. 
   # w+ ^' x* y& j: I$ f# ~
9. 
   , O% ^+ ~% f& H
10. hover:设置对象在其鼠标悬停时的样式表属性。
    
11. 
    
12. visited:对象在其链接地址已被访问过时的样式表属性。
    1 n' ~$ e" {  Q' l# p
13. 
    / R4 w( V0 t  @+ P
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; }图片连接相关
    . x2 a* v4 p& t0 x
19. 
    
20. 
    
21. cite:这个一般是引用标签的时候用的,不知道用来这里做什么
    * C9 q# D) K( U
22. 
    % p+ Z& n, _& Z) B+ o
23. 
    
24. font-style:字体式样,一般常用参数有:
    
25. normal : 正常的字体
    1 B6 Z9 \" W- z' E, E
26. italic : 斜体。对于没有斜体变量的特殊字体，将应用oblique
    
27. oblique : 倾斜的字体
    6 @/ |5 L: _6 N% o9 M+ g* H
28. 
    7 S4 R# j3 I$ q, D1 K
29. 
      u6 |1 Q+ x5 @. N, K
30. float: right 该属性的值指出了对象是否浮动及如何浮动。常用参数如下:
    
31. none : 　对象不浮动
    
32. left : 　对象浮在左边
    
33. right : 　对象浮在右边
    
34. 
    
35. 
    
36. important:样式表条目,提升指定样式规则的应用优先权。
    
37. 
    
38. 
    
39. background: transparent 这个的意思就是背景透明...
    
40. 
    . [" q; x1 l+ O, t2 h; _3 h
41. 
    + E; C0 C  l4 O0 H% B  C5 I/ N; b& j
42. 
    
43. font-weight: normal :文本字体的粗细,常用参数如下:
    
44. normal : 正常的字体。相当于number为400。声明此值将取消之前任何设置
    
45. bold : 粗体。相当于number为700。也相当于b对象的作用
    # w0 a( s- p$ ^7 K% q
46. bolder : IE5+　特粗体
    0 _: V  I) G# u
47. lighter : IE5+　细体
    
48. number : IE5+　100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
    . E' Z7 ]& C; b8 ]/ z' c9 G
49. 
    / `9 {) Q7 Q  z- o0 l. ?
50. cursor: pointer:这个是鼠标放在对象中的状态,简单点来可以这样说,也就是鼠标放在连接上的时候显示的鼠标形状,一般有以下N种参数,这个真的是TMD的多啊
    , ]& Y( n0 Q& `4 }
51. 语法：(每一竖隔开为一个状态)
    3 f- E4 ^4 E6 @7 Y, z5 ^9 s0 y; j
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)
    ; ?, h* C) `/ ~6 z( |  l' H
53. 
    - J1 z& N- O- i- h
54. 
    
55. 
    2 r) j, j5 F' O5 w- a+ r* f! k
56. 
    % S' H7 [0 ~4 d% L
57. 
    7 H, `% E- C6 \# Z4 g0 J2 Y
58. 
    / X" N$ B7 g, C, p, ^7 ]9 r
59. 
    

复制代码

傲天♂浪子追风

1. /*-----------------------------------------------------------------------------------表单通用样式*/
   
2. 
   , [" f& z4 ]2 X7 r% u4 Q. w5 j
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;
   " S/ z4 s$ o6 q0 x8 t: i
6.                 border-top-color: #C9E3F0; border-right-color: #2A8ABA; border-bottom-color: #2A8ABA; border-left-color: #C9E3F0; }
   4 G0 M# p% b  J. I8 ^
7.         fieldset { border: 0; padding: 0; }
   
8.                 legend { display: none; }
   
9.         label { cursor: pointer; margin-right: 0.5em; }
   0 b' ~/ ]1 ?* U7 s* c5 n+ O  x

复制代码

bronwen

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

傲天♂浪子追风

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

傲天♂疯紫

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