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

傲天♂浪子追风

1. * { word-break: break-all; } /*在IE中实行强制换行*/
   * H" C: z/ N  n9 Z
2. #newsblock { margin-top: 4px; }
   
3. /*-----------------------------------------------------------------------------------综合设置*/
   9 ?% P/ m: t; I, ^) U6 l
4. 
   , a) O( M3 q9 S' y2 [1 u
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; }
   ) d8 t0 G4 J; ~" L4 D, ~  [/ b: w
7. 
   8 _. H/ \3 I- E" E$ Z: m& X; m
8. /*链接样式*/
   " }. B% `+ D% s8 U
9. a { color: #000; text-decoration: none; }
   , k* W8 }1 w3 a' o1 U
10.         a:hover { text-decoration: underline; color: #000098; }
    
11.                 a:visited { color: #666;}
    : R! g) G8 P+ E! \( J* P4 _
12.         #topmenu a, #menu a, .imglist a, #hotspace li a { text-decoration: none; }
    1 _9 V" y- h+ H; I# C
13.                 #topmenu a:hover, #menu a:hover, .imglist a:hover, #hotspace li a:hover { text-decoration: underline; }
    & W4 [' Q! L+ V% W! H
14.         a img { border: none; }
    
15. li cite { font-style: normal; font-size: 12px; float: right; width: 4em; color: #999; }
    ( [; ?* R, D0 d+ s1 m
16.         li cite a { color: #999; }
    
17.                 li cite a:visited { color: #999; }
    ( u; P# K1 b' H8 l$ j
18. .more { float: right !important; color: #000098 !important; background: transparent !important; font-size: 12px !important; font-weight: normal !important; cursor: pointer; }
    : }! o, ^: |3 Y: V! n
19. 
    
20. /*-----------------------------------------------------------------------------------表单通用样式*/
    
21. 
    $ `5 I3 C& w5 ]: x& A
22. form { margin: 0; }
    6 t* C/ q4 w% @" ~( q
23.         input, textarea, button, select { font: 1em Arial, Helvetica, sans-serif; }
    / I$ S9 r& \) e
24.         button { height: 1.8em; padding: 0 0.3em; background: #9FC8DF; cursor: pointer; border: 1px solid;
    3 A  B( w1 }; V
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; }
    4 a0 i6 a' ~# o+ T) r
28.         label { cursor: pointer; margin-right: 0.5em; }
    2 e- A4 i$ x6 r) j  J% Z
29. 
    ; e# t/ t0 }% G+ n4 W$ x: s7 `; K
30. /*-----------------------------------------------------------------------------------头部风格 Header*/
    / q2 U* _8 x, q& _1 m8 M- `9 i
31. /*顶部导航*/
    0 a" R0 Y2 c: r% a3 r" T6 L( @
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; }
    , ^7 F7 k, ]3 w, Y
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; }
    2 h2 R! Y% w* M5 T/ d
36. 
    
37. #pagetitle { padding: 8px 0; height: 76px; he\ight: 60px; border-bottom: 4px solid #F5FBFF; }
    
38.         #logo { border-right: 1px solid #86B9D6; padding: 0 10px; margin-right: 10px; }
    
39.         .banner468 { float: right; }
    ( I, R9 `) y! B7 T
40. 
    , t, h/ o2 i& V; E: M0 m* u
41. /*主导航*/
    8 p2 J( F6 I& [2 q/ B
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; }
    : ?/ U( x6 B( B- u6 K; f+ j& N% U
44.                 #menu li { float: left; margin: 0 2px; width: 6em; overflow: hidden; white-space: nowrap; }
    
45.         /*首页导航*/
    " O8 x( Z( u" z$ v6 W) \
46.         #menu dl { margin: 0 1.5em; padding: 0; height: 25px; overflow: hidden; }
    
47.                 #menu dt { float: left; width: 4em; white-space: nowrap; }
    . G+ i9 p$ m' C* L
48.                         #menu dt a { color: #000098 !important; }
    # w; D  ]6 _# b% t/ i. B
49.                 #menu dd { float: left; width: 6em; margin: 0 2px; overflow: hidden; white-space: nowrap; }
    
50. 
    
51. /*您的位置导航*/
    % r, A+ j, ~9 i% R, J
52. #navigation { padding: 1.2em 0; }
    : W. N9 B$ M2 X' Z
53.         #navigation p { margin: 0;}
    
54.                 #navigation p a, #navigation p strong { margin: 0 0.5em; }
    , V9 V0 V6 P0 `2 r1 w
55.         #searchform { float: right; }
    
56.                 #searchform * { vertical-align: top; }
    ) u% @+ t* c. d8 s- l1 ]1 y# I
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; }
    3 s6 U/ e' F" [7 i/ x0 W
60.                 #navigation.simplepage p { float: right; margin-right: 0.5em; }
    
61.                 .simplepage h2 { margin: 0; font-size: 1.2em; padding-left: 0.5em; }
    # A& I1 h) M0 M
62. 
    2 P, S. `5 r. c! ]/ i
63. /*-----------------------------------------------------------------------------------布局*/
    
64. 
    
65. .content { /*三列布局*/
    
66.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y 0 0; }
    
67.         /*\*/ * html .content { height: 1%; } /**/ *>.content { overflow: hidden; }
    
68. .contentL { /*两列布局，侧边在左侧*/
    ! o1 u9 Y+ x) n# E
69.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y -590px 0; }
    
70.         /*\*/ * html .contentR { height: 1%; } /**/ *>.contentR { overflow: hidden; }
    
71. .contentR { /*两列布局，侧边在右侧*/
    ! O( O8 d" B: U2 E1 A
72.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y 580px 0; }
    
73.         /*\*/ * html .contentR { height: 1%; } /**/ *>.contentR { overflow: hidden; }
    4 c9 k+ [7 u( s
74. /*侧边样式*/
    7 r- f" W/ f. l1 Z
75. .sideL { width: 296px; float: left; overflow: hidden; }
    * v3 v! v, [9 U9 ~! D: C/ x7 J# v
76. .sideR { width: 202px; float: right; overflow: hidden; }
    , R5 m3 H% R1 _5 @7 O- h; H" U3 m
77. /*中间部分样式*/
    
78. .mainarea { margin: 0 4px; width: 382px; float: left; }
    
79.         .contentL .mainarea { margin: 0 0 0 4px; width: 556px; }
    0 S/ D: H: R6 m
80.         .contentR .mainarea { margin: 0 4px 0 0; width: 576px; }
    
81. 
    
82. /*-----------------------------------------------------------------------------------版块样式*/
    
83. 
    2 }2 {# S3 [( v, k2 c
84. /*版块标题*/
      n; ?" c  k( l3 w2 w
85. .blocktitle { clear: both; border: 1px solid #86B9D6; padding: 1px; margin-bottom: 4px; line-height: 30px; }
    ) Q; n4 N  f# r+ H+ t1 m
86.         .blocktitle h2 { font-size: 1.2em; margin: 0; padding: 0 5px; background: #9FC8DF url(../images/new/title_bg.gif) repeat-x; }
    8 N  B* F- c, K8 b; i3 C
87.         .blocktitle .more { margin-right: 5px; }
    2 v4 s: b( ^! P8 p) e+ v
88. 
    3 r# O# c3 D" K1 F3 l
89. /*头条信息*/
    
90. #headline { padding: 5px; height: 70px; he\ight: 58px; overflow: hidden; }
    8 u) r# R. F8 [9 |
91.         #headline strong { font-size: 1.2em; }
    4 ]% y, K5 S9 x  W- b
92.         #headline p { margin: 0.3em 0; }
    
93.         #headline img { float: right; width: 48px; height: 48px; border: 4px solid #FFF; }
    : k9 Z  n& ^  |' F
94. 
    ) ]! x% p1 g7 P; c( u
95. /*侧边版块*/
    
96. .sideblock { margin: 0 0 3px; border: 1px solid #86B9D6; background: #FFF; padding: 3px; }
    $ _0 s6 R8 x/ }2 M( h3 t
97.         .boldblock { padding: 1px; background: #9FC8DF; } /*突出版块*/
    
98.         .cleanblock { border: 1px solid #86B9D6; margin: 0 0 4px; padding: 0; background: #F5FBFF; } /*简单版块*/
    " X" Z6 z4 o2 Z3 C
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%; } /**/
     
101.                 .sideblock p { margin: 0.3em; line-height: 1.6em; }
     ) }. [2 Z% \3 m( G2 z5 U
102.                         .headimg { float: right; margin: 5px 0 2px 5px; width: 80px; height: 80px; border: 4px solid #E2F0F9; }
     
103. 
     
104.         /*侧边多行列表*/
     + G3 a$ M: `5 z- ^; Z, U$ C
105.         .sideblock dl { margin: 0; padding: 5px; background: #FFF; line-height: 1.8em; }
     
106.                 /*\*/ * html .sideblock dl { position: relative; } /**/
     8 [  E2 M% l: O& B5 j
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; }
     
109.                         .sideblock dd a { color: #999; }
     ) V7 J5 p* e7 o
110. 
     
111. /*单行信息列表*/
       F  b3 t- M9 j% @. Z" V
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; }
     , T: R+ I1 U* }6 ^5 m
114.         .mainarea .msgtitlelist { font-size: 1.2em; }
     
115.         .sideblock .msgtitlelist { background: #FFF; }
     
116. 
     . n4 V& @3 t5 R( q: m
117. /*多行信息列表*/
     & [/ G+ n9 k8 F: x
118. .messagelist { margin: 5px 0; padding: 0; list-style: none; line-height: 1.6em; }
     2 s0 e9 U- q: g, ]
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; }
     
122.                                 .messagelist li h4 a:visited { font-weight: normal; }
     + {! z* y; `3 v  V
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; }
     
127.                 .messagelist dd { font-size: 12px; margin: 0; padding-left: 1em; color: #999; }
     ! d, s# i5 N4 q5 u
128.                         .messagelist dd a { color: #999; }
     
129. 
     
130. /*热门话题*/
     
131. #hottag { overflow: hidden;  }
     
132.         #hottag div { background: #FFF; padding: 0.5em; overflow: hidden; line-height: 1.8em; }
     * {! |, o8 v+ V- V. J8 O1 {
133.                 #hottag div { color: #999; overflow: hidden; }
     + D) F% P' e! N
134.                 #hottag a { margin-right: 0.2em; white-space: nowrap; }
     0 Z% j: \3 H- ?) \9 b
135.                         #hottag a em { color: #999; font-style: normal; }
     
136. 
     ( c; n! m8 n; H# i
137. /*用户面板*/
     
138. #userpanel { height: 8.8em; overflow: hidden; }
     
139.         #userpanel form { margin: 5px auto !important; margin: 0 auto; width: 150px; }
     
140.                 #userpanel input { width: 90px; }
     4 N9 Y0 p# W. z5 n: d8 r* x
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; }
     ) q2 p4 J. o8 k1 m
144.         /*登录后*/
     : Z( D# v( A% A6 D1 o
145.         #userpanel li { border-bottom: 1px solid #BBE9FF; background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.8em; padding-left: 12px; }
     0 {& d# `0 V6 d; a- T: @  R
146.                 #userpanel li a { color: #000098; }
       T$ A* E( o2 `' x$ i1 ?" _1 G
147. 
     
148. /*空间之星*/
     
149. #spacestar ul { width: 168px; margin: 0 4px; padding: 0; height: 235px; }
     ' ?1 \3 O3 I0 k9 H: P  ~) c
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; }
     : v! z) M0 P2 D" f4 D" ]
152.         #spacestar p { margin: -4px 0 !important; margin: 0 0; line-height: 20px; height: 20px; }
     5 ?" Y+ d! P8 }" h% u1 j  k
153. 
     
154. /*同城空间*/
     : C+ b3 E( T, K7 H4 W
155. #cityspace { background: #F0F9FF; }
     & Q+ ?2 D/ o# F# _
156. #cityspace form { width: 10.5em; margin: 0 auto; padding: 5px 0; }
     2 ?7 D' |6 |! w7 t
157.         #cityspace select { margin: 2px 0; }
     4 ^7 r8 ~" j0 M3 T
158.         #cityspace button { float: right; margin-top: 4px; width: 3.5em; height: 3.5em; }
     ' b$ d0 l, i4 g- j9 n
159.         #blogblock #cityspace { margin: 0 0 4px 0; }
     7 c  {9 D5 G+ b* q0 i
160. 
     
161. /*空间排行*/
     , W( g, P" ~/ L+ R" U. e1 e
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; }
       y/ N2 g4 K- e5 O  J
164.         #hotspace em { float: right; font-style: normal; font-size: 9px; color: #999; width: 40px; }
     
165. 
     ! O9 w/ x; R7 r" d# o/ ], y7 ^
166. /*热门文章 */
     
167. #hotarticle { border: 1px solid #86B9D6; background: #E2F0F9; padding: 3px; position: relative; }
     
168.         #hotarticle h3 { font-size: 1.2em; margin: 0; line-height: 22px; border-bottom: 1px solid #86B9D6; }
     + y1 P7 c2 N2 ]6 t8 a, f$ ^
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; }
     + d: F! f" p! G, }# M) \$ a( N
172.         #hotarticle ul { background: #FFF; margin: 0; padding: 0.5em; list-style: none; line-height: 1.7em; height: 16.5em; overflow: hidden; }
     6 }" e) j6 c8 [! N* s+ Z
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; }
       ?" N/ A# T- i; b% S& I1 r* G: D
174. 
     
175. /*图片列表*/
     
176. .imgthumblist { margin: 0 3px; padding: 0; list-style: none; }
     % f3 ?+ b% @" n2 L9 K1 g2 M5 ?
177.         /*\*/ * html .imgthumblist { height: 1%; }/**/ *>.imgthumblist { overflow: hidden; }
       B: V& p9 K8 k+ F: f
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; }
     ! \3 T5 c) _  R- @0 E4 _0 U
179.                         .imgthumblist li.list1line { height: 123px; height: 115px; }
     
180.                         .imgthumblist li.list2line { height: 143px; height: 135px; }
     
181.                         .contentL .imgthumblist li { margin: 0 1px 3px; }
     : {! n# J7 I% ^$ K
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; }
     # r8 x5 C4 J; \8 z+ W9 Y
186.                 .throughgallery .imgthumblist li { height: 120px; margin: 3px 1px; }
     
187. 
     
188. /*商品*/
     . P7 V2 H8 F: }
189. /*\*/ * html .goodsthumblist { height: 1%; } /**/ *>.goodsthumblist { overflow: hidden; }
     / J! c# c2 h9 ?: w  j9 A
190.         .goodsthumblist { margin: 0; padding: 3px 0; list-style: none; }
     
191.                 .goodsthumblist li { float: left; width: 90px; height: 100px; text-align: center; }
     % V1 O# c0 h# ]2 i4 Y( G5 k
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; }
     # G  n/ y% i, S4 M
194. 
     1 [; d5 S5 ~4 G3 x6 A( p
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; }
     4 [) |  P) B6 V9 c
197.                 /*\*/ * html .imgtitlelist li { height: 1%; } /**/ .imgtitlelist>li { overflow: hidden; }
     7 t" g( |, ?8 Y9 I
198.                         .imgtitlelist li h4 { margin: 0.3em 0; font-size: 1em; }
     * _2 g' I% U: v- \, Q( ?5 y- W3 x; \
199.                         .imgtitlelist li img { float: left; margin-left: -85px; width: 70px; height: 70px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED; }
     
200.                         .imgtitlelist li p { margin: 0; line-height: 1.5em; }
     
201.         .sideblock .imgtitlelist li { padding-left: 65px; }
     . r' x2 ]$ r: A3 X* F, d7 U  r$ u
202.                 .sideblock .imgtitlelist li img { width: 48px; height: 48px; margin-left: -60px; }
     
203.        
     
204. 
     
205. /*栏目区块列表*/
     
206. .category {  margin: 4px 0 10px 0; }
     & P( j4 N4 b* J. T: ~
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; }
     
209.                         .category h3 strong a { color: #333; text-decoration: none; }
     ! h! k$ ]1 k: O+ s
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; }
     ; o5 i7 ^% K8 U
212.         .catecommend { background: #F0F9FF; margin: 0; line-height: 2em; height: 2em; overflow: hidden; padding: 0 1em; }*/
     
213.                 .catecommend a { color: #000099; white-space: nowrap; margin-right: 0.5em; }
     
214. 
     
215. 
     # N# ~* {0 V  d* D: H  h
216. /*-----------------------------------------------------------------------------------首页各版块*/
     # F  B9 `) e: S' x" D
217. 
     5 M8 l! T( `$ x  H
218. /*#commendimage { height: 155px; }
     * a  N+ k" C0 ~  Y5 s. o& n
219. #topicnews { height: 217px; }
     
220. #newgoods, #commendgoods { height: 200px; }
     
221. #hotcommentfile, #hotfile, #newlink, #hotlink { height: 220px; }*/
     + x0 v% B1 l: r: l  Y
222. 
     4 _5 g! P% S7 I  W9 `8 J
223. 
     7 }" g: C& h5 z9 v8 B6 F$ ?$ y( T
224. 
     
225. 
     
226. /*信息列表*/
     * k+ M9 ?& {: {
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; }
     4 k6 s# r+ _, H
230.        
     
231.         .articlelist ul { margin: 0; padding: 0; background: #FFF; padding-left: 5px; list-style: none; }
     7 q6 M7 J; B: u* ]6 T: k6 q
232.                 .articlelist li { position: relative; padding-left: 60px; margin-top: 1em; }
     
233.         .articlelist h4 { margin: 0; background: #F0F9FF; font-size: 1.2em; padding: 0.2em 0.5em; cursor: pointer; }
     
234.                 .articlelist h4 em { font-style: normal; font-weight: normal; font-size: 0.8em; color: #B353B3; margin-left: 0.3em; }
     
235.                 .articlelist h4 a { color: #000099; }
     " p$ e# `. |4 _7 B7 m: M. M7 n1 @
236.                 .articlelist li img { position: absolute; left: 0!important; left: -67px; top: 0; border: 3px solid #9FC8DF; width: 48px; height: 48px; }
     
237.                
     ( [2 t+ u6 _; k5 T
238.                 .articlelist li strong { font-weight: normal; color: #999; line-height: 2em; padding-left: 0.5em; }
     
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; }*/
     - O* T- w. E& q* B
242. 
     6 P0 @2 M( S7 u* a4 C1 `
243. 
     & _$ a" ]  ^$ p) T. t8 F
244. .catepic { text-align: center; }
     6 e7 q* Z! H7 }' v3 j
245.         .catepic img { margin-top: 10px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED;
     0 i% Q# E* ]  Q2 x) p) }& r% y0 D$ P5 |
246.                 max-width: 150px; max-height: 150px; width: expression(this.width > 150 ? 150: true); height: expression(this.height > 150 ? 150: true); }
     # ^7 n7 s6 n  }
247.         .catepic p { text-align: left; margin: 0.5em; }
     
248. 
     
249. /*专题列表*/
     
250. #subjectlist { border-color: #86B9D6; padding: 2px; }
     5 P  r4 E5 t6 r
251.         #subjectlist h3 { border: none; background: #9FC8DF; }
     
252.         #subjectlist li { border-bottom: 1px solid #E2F0F9; text-align: center; padding: 3px; }
     , o  O" A+ T' \2 B7 H( L1 x
253.                 #subjectlist p { margin: 0; line-height: 1.2em; }
     
254. 
     
255. 
     5 w# ^* C( m) ]( \2 A0 ?& o* A4 r; p
256.         #xspace-rates { height: 2em; }
     
257.                 #xspace-rates label { float: left; line-height: 24px; margin-right: 5px; }
     + i. F0 K8 \3 ]# U5 C
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; }
     2 W, u0 K& }: w& \: r  P
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; }
     0 E$ k( S/ Q$ Z5 C/ |
261. 
     
262. 
     + w0 v! p, r. r% `3 i
263. #panel { width: 600px; overflow: hidden; margin: 1em auto; }
     0 e1 M7 W' j- @5 \  r( F: x: G
264. 
     : b0 J0 W4 r$ G+ z) A
265. 
     5 r8 S5 H* w* @0 ]: {
266. /*Pages*/
     
267. .pages { text-align: right; border-top: 1px solid #9FC8DF; }
     3 q1 ?7 L4 N( I0 B6 M3 y. P
268.         /*.pages table { margin: 3px 0 3px auto; text-align: center; }
     # A, Z% k; v" Y$ h; L
269.                 .pages td { padding: 0 5px; border: 1px solid #B9D0ED; background: #FFF; }
     
270.                 .pages a { text-decoration: none; }
     
271.                 .pages .currentpage { background: #F0F9FF; border-color: #86B9D6; font-weight: bold; }*/
     
272. 
     
273. /* 分页 */
     & d0 k% D; d# W9 H2 \5 s
274. .xspace-page { margin: 2px 2px 2px auto; }
     : @/ a1 o! c) H% e" |9 i; Q8 X
275.         table.xspace-page a { display: block; background: #E2F0F9; padding: 0.3em 0.5em; text-decoration: none; }
     
276.                 table.xspace-page a:hover { background: #86B9D6; }
     
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; }
     * ], @2 ?0 V: e7 z( O$ {
281.         .smalltxt a, .smalltxt a:visited { color: #999 !important; }
     
282. 
     
283. /*-----------------------------------------------------------------------------------页脚 Footer*/
     
284. #footer { clear: both; border-top: 2px solid #86B9D6; padding-top: 1em; padding-bottom: 2em; text-align: center; font: 100% Verdana, Arial, Helvetica, sans-serif; }
     
285.         #footer p { margin: 0.3em 0; color: #999; }
     # j3 r- G& M! \3 d4 \! r
286.         #footer strong { color: #007AB6; }
     7 W9 p+ j1 a7 o$ Y7 O
287.         #footer em { font-style: normal; font-weight: bold; color: #96A800; }
     7 i" Q5 v8 D- p
288.        
     
289. .imglogolist { margin: 0; padding: 0; list-style: none; text-align: center; }
     
290.        
     
291. #articledetail { border: 1px solid #86B9D6; text-align: center; }
     3 `% R) ]+ Y, }' b) i* ?
292. .articletitle { font-size: 1.6em; margin: 1em 0 0.5em; }
     - j: L! J/ l/ X* N4 o
293. .articleinfo { border-bottom: 1px solid #9FC8DF; margin: 0;}
     
294. .articlectrl { margin: 0.5em 0 1.5em; }
     
295. 
     
296.         #articlebody { width: 98%; margin: 0 auto; overflow: hidden; text-align: left; overflow-y: hidden; line-height: 1.8em; font-size: 1.2em; }
     $ L/ Q9 b6 a8 I
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 ]! H" H1 J, o9 s' R$ j
302.                 #articlebody .addoninfo h5 { font-size: 1em; margin: 0; line-height: 2em !important; border-bottom: 1px solid #EEE; padding-left: 1em; }
     1 h; |9 N' |* z# b! Y4 v7 r# Z' ~, B
303.                 #articlebody .addoninfo ul { margin: 0.5em 0 0.5em 2em; padding: 0; }
     . Z8 C$ }+ y: g, y: h  A" a
304.                         #articlebody .addoninfo li { line-height: 1.6em !important; }
     # {' i6 H  }3 V6 V' i, z* x
305.        
     
306.         #articlebody img { width: expression(this.width > 500 ? 500: true); max-width: 500px;  }
     
307.        
     6 @4 m9 e6 X1 p( e$ h; ]
308.         #articlebody kbd.showvideo, #articlebody kbd.showflash { font: 1em Arial, Helvetica, sans-serif; cursor: pointer; text-decoration: underline; }
     ; q8 B, @$ i3 U! k, |5 X
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; }
     6 V8 D0 y7 Z6 e4 |% q* `
311.                                 #commentlist img { max-width: 500px; width: expression(this.width > 500 ? 500: true); }
     8 p! ?& S0 l6 T- }8 E
312.                         #commentlist .messagelist li div { width: 98%; margin: 0 auto; overflow: hidden; text-align: left; overflow-y: hidden; line-height: 1.8em; }
     2 N! a/ O9 r/ F+ f3 h
313.                                 #commentlist .messagelist li div * { line-height: normal; }
     5 `, A6 `8 z8 N6 S1 C! @6 ]
314.                                         #commentlist .messagelist li div  p, #commentlist .messagelist li div  div { line-height: 1.8em !important; margin: 10px 0; }
     7 r$ I  n6 i5 g8 @9 t
315.                                                 #commentlist .messagelist li div  p *, #commentlist .messagelist li div  div * { line-height: normal !important; }
     9 k; X1 m4 \% Z# t7 E
316. 
     ) [5 v+ b" Y# ^, y
317. /*发表评论*/
     
318. #comment { margin-top: 4px; }
     8 L0 W) h0 ~7 W, Q
319.         #comment h3 { margin: 0 5px; font-size: 1em; line-height: 2em; }
     6 ^/ @6 w0 M9 p
320.         #comment form { background: #FFF; margin: 0; padding: 5px; }
     
321.         #comment p { margin: 0.3em 0; }
     - i: Q8 b) S0 w- I
322.         .seccodeline * { vertical-align: middle; }
     . W- ]& y" A: {4 O
323.         #xspace-rates { height: 2em; }
     ' _# D& B9 U3 f( k  c! r3 y
324.                 #xspace-rates label { float: left; line-height: 24px; margin-right: 5px; }
     % t  |4 X1 ~1 d
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; }
     * s' I9 E$ q6 i# u( l: A. A" k
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; }
     9 U  [- X  K7 ?$ u% J% A. z2 S
328. 
     6 L0 \5 r. j3 D! K& Q
329. /*AJAX div*/
     ) Q" W- }: I* p1 T; [! u
330. .xspace-ajaxdiv { position:absolute; padding: 5px; border: 1px solid #BBB; background: #FCFFEF; text-align: left; }
     0 \3 K/ D3 E" I; h0 y& {( F
331.         .xspace-ajaxdiv h5 { line-height: 24px; font-size: 1em; margin: 0; }
     5 j- W* w4 v4 C( w
332.                 .xspace-ajaxdiv h5 a { float: right; font-weight: normal; }
     , J+ N8 Y3 b  U7 ~. ?' ~
333.         .xspace-ajaxcontent { background: #FFF; border: 1px solid #EEE; }
     6 [3 ]5 @7 ~% `
334.                 .xspace-ajaxcontent form { margin: 0; }

复制代码

傲天♂浪子追风

1. /*-----------------------------------------------------------------------------------综合设置*/
   
2. 
   
3. body { margin: 0; background: #FFF; color: #333; text-align: center; font: 12px Arial, Helvetica, sans-serif; }
   & v' L- _4 \1 W7 ?5 i/ Z% K# X- O
4. #wrap { background: #FFF; margin: 0 auto; text-align: left; width: 910px; padding: 0 4px; w\idth: 910px; }
   3 g, l  m! m! X: R5 I8 a2 N3 n
5. 
   4 e5 R% q' p4 H4 w; q

复制代码

分析
, }. u7 k+ `, B- I) S; x$ w

1. margin属性说明：
   7 E' N# s0 }  k( W& I& t2 D% o
2. 
   ' v: t% V7 K/ d" \, D' m3 q
3. 检索或设置对象四边的外延边距。
   ) I. m& P9 K" |' a5 c
4. 如果提供全部四个参数值，将按上－右－下－左的顺序作用于四边。
   ( h. p- c7 O* B& n! C! P3 Z
5. 如果只提供一个，将用于全部的四边。
   
6. 如果提供两个，第一个用于上－下，第二个用于左－右。
   
7. 如果提供三个，第一个用于上，第二个用于左－右，第三个用于下。
   
8. 内联对象要使用该属性，必须先设定对象的height或width属性，或者设定position属性为absolute。
   
9. 在IE4+，margin属性不可用于td和tr对象。
   
10. 外延边距始终透明。
    
11. 
    
12. color : 　指定颜色
    
13. text-align:文本的对齐方式。(left : 　左对齐,right : 　右对齐,center : 　居中,justify : 　两端对齐)
    
14. font: 12px Arial, Helvetica, sans-serif;  :这段是字体相关的
    
15. 
    & c7 t: `, z. e) x* f
16. 
    # v% G( Q9 \8 K3 B; K( g

复制代码

傲天♂浪子追风

1. /*链接样式*/
   
2. a { color: #000; text-decoration: none; }
   " C; Z4 s. _6 ^0 a8 ~
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; }
   ! }5 o! Q( ~4 A/ v
6.                 #topmenu a:hover, #menu a:hover, .imglist a:hover, #hotspace li a:hover { text-decoration: underline; }
   8 ]  |# p- G; I& A- W$ T6 u5 ^4 u
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; }
    $ }  ^$ x3 f$ D: d* z
11. .more { float: right !important; color: #000098 !important; background: transparent !important; font-size: 12px !important; font-weight: normal !important; cursor: pointer; }
    & ^/ L" M6 E: J7 H) l! f
12. 
    1 Q' j+ b) h/ t* l& e  Z) c

复制代码

. h1 j: e( m$ [  ~& a分析

1. 
   + b/ Q" k" F, H8 x
2. text-decoration:文本连接的属性,一般有以下几种参数:
   7 `/ Z( j) t, o( b9 j7 }* n% D4 f7 C
3. none : 　无装饰
   
4. blink : 　闪烁
   ) f( a/ e) ?8 w3 h+ U
5. underline : 　下划线
   " D. Z( m" M2 T& p7 m9 a
6. line-through : 　贯穿线
   
7. overline : 　上划线
   1 v8 X. ]( s- _
8. 
   
9. 
   
10. hover:设置对象在其鼠标悬停时的样式表属性。
    
11. 
    
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; }:
    8 k2 t9 |+ j$ w" d
16. 上面这两行是与鼠标相关
    
17. 
    
18. a img { border: none; }图片连接相关
    1 G( d! ~% S6 A2 v
19. 
    
20. 
    5 n6 R0 u: I5 b" }1 {2 ~6 w
21. cite:这个一般是引用标签的时候用的,不知道用来这里做什么
    
22. 
    
23. 
    
24. font-style:字体式样,一般常用参数有:
    
25. normal : 正常的字体
    
26. italic : 斜体。对于没有斜体变量的特殊字体，将应用oblique
    - [' S& {2 [6 h: o, R4 \, l
27. oblique : 倾斜的字体
    ! W8 n% {+ ~! P; Y
28. 
    
29. 
    
30. float: right 该属性的值指出了对象是否浮动及如何浮动。常用参数如下:
    
31. none : 　对象不浮动
    3 r1 m% D- ~0 K" d/ s0 t& v
32. left : 　对象浮在左边
    6 T+ H  @: j4 d* S; `; u6 i
33. right : 　对象浮在右边
    ' p# ^' B5 T& w/ ], Y4 j! V
34. 
    
35. 
    
36. important:样式表条目,提升指定样式规则的应用优先权。
    1 a4 z% {& @3 Z
37. 
      w4 o: b9 }. n
38. 
    
39. background: transparent 这个的意思就是背景透明...
    
40. 
    - R! Z6 u/ a, H( [8 W7 t
41. 
    
42. 
    
43. font-weight: normal :文本字体的粗细,常用参数如下:
    8 z, w1 Q+ F( j6 B  _
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
      {+ n8 r. ^! O
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)
    # F, F" g# d3 x& y0 N) _$ c  f+ ^
53. 
    
54. 
    
55. 
    
56. 
    
57. 
    
58. 
    
59. 
    5 N( P5 K. D. }; q: {, x% b

复制代码

傲天♂浪子追风

1. /*-----------------------------------------------------------------------------------表单通用样式*/
   ) d1 m" y* j8 V- a4 _5 D/ z- N
2. 
   ! `. H8 U5 r; e* ^' ^
3. form { margin: 0; }
   ( ^0 f6 M' u" A0 k) t4 z
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;
   $ @5 R$ w, P$ N' P+ o- z8 h( v
6.                 border-top-color: #C9E3F0; border-right-color: #2A8ABA; border-bottom-color: #2A8ABA; border-left-color: #C9E3F0; }
   3 o  i+ q9 H, z8 Z5 ?% V, u+ {0 v! M
7.         fieldset { border: 0; padding: 0; }
   
8.                 legend { display: none; }
   4 e4 A; j9 n- Q
9.         label { cursor: pointer; margin-right: 0.5em; }
   

复制代码

bronwen

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

傲天♂浪子追风

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

傲天♂疯紫

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