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

傲天♂浪子追风

1. * { word-break: break-all; } /*在IE中实行强制换行*/
   . I6 K! Z% w0 s# W" @7 Q5 h/ k
2. #newsblock { margin-top: 4px; }
   
3. /*-----------------------------------------------------------------------------------综合设置*/
   , J( T1 d) ?* d% K* S5 m
4. 
   4 N3 ~+ p9 J# F8 s( L3 O9 v! A
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. 
   
8. /*链接样式*/
   0 y& J4 {5 U8 ~! |
9. a { color: #000; text-decoration: none; }
   
10.         a:hover { text-decoration: underline; color: #000098; }
    
11.                 a:visited { color: #666;}
    
12.         #topmenu a, #menu a, .imglist a, #hotspace li a { text-decoration: none; }
    * v1 u; d$ d. P- O7 d9 {7 [
13.                 #topmenu a:hover, #menu a:hover, .imglist a:hover, #hotspace li a:hover { text-decoration: underline; }
    % }' G# f0 @6 H; P
14.         a img { border: none; }
    
15. li cite { font-style: normal; font-size: 12px; float: right; width: 4em; color: #999; }
    / ]! M/ u) d0 k* }
16.         li cite a { color: #999; }
    
17.                 li cite a:visited { color: #999; }
    : p, p" @4 H, O! i0 G
18. .more { float: right !important; color: #000098 !important; background: transparent !important; font-size: 12px !important; font-weight: normal !important; cursor: pointer; }
    
19. 
    2 j; R  z( Z5 A0 t5 V) B3 \: V
20. /*-----------------------------------------------------------------------------------表单通用样式*/
    
21. 
    
22. form { margin: 0; }
    * ^0 E5 j6 H  v% B1 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;
    
25.                 border-top-color: #C9E3F0; border-right-color: #2A8ABA; border-bottom-color: #2A8ABA; border-left-color: #C9E3F0; }
    6 ]- N2 p; P/ j! a% s) a
26.         fieldset { border: 0; padding: 0; }
    
27.                 legend { display: none; }
    " {  i1 F# s. c& A) Q! N. U
28.         label { cursor: pointer; margin-right: 0.5em; }
    0 c* |* x& \) }8 z0 n
29. 
    
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; }
    ; J: q! m( `* l  _: B: w
33.         #topmenu ul { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid #86B9D6; }
    . o% B  Q) `6 z- f! J
34.                 #topmenu li { display: inline; border-left: 1px solid #86B9D6; padding-left: 1em; padding-right: 0.5em; }
    
35.                         #topmenu a { color: #154BA0; }
    & G: g! X6 R- h- g+ h4 m: }
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; }
    + |2 @  [/ J. k" ~: f
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.         /*首页导航*/
    ; Q7 h8 a4 i+ x
46.         #menu dl { margin: 0 1.5em; padding: 0; height: 25px; overflow: hidden; }
    
47.                 #menu dt { float: left; width: 4em; white-space: nowrap; }
    ( }3 u! |+ ]- \. H" X
48.                         #menu dt a { color: #000098 !important; }
    
49.                 #menu dd { float: left; width: 6em; margin: 0 2px; overflow: hidden; white-space: nowrap; }
    
50. 
    
51. /*您的位置导航*/
    + A" b( F. [2 e7 L' ~2 ~$ c
52. #navigation { padding: 1.2em 0; }
    2 c* R, S5 ~3 }* m4 \& X; d. s
53.         #navigation p { margin: 0;}
    9 V/ X+ K7 a; z7 V+ |
54.                 #navigation p a, #navigation p strong { margin: 0 0.5em; }
    4 s& ]3 H/ ?. i3 m, D9 O
55.         #searchform { float: right; }
    " o- z% f/ l, {
56.                 #searchform * { vertical-align: top; }
    
57.                 #searchform button { margin-left: 0.5em; }
    ) S7 I+ P; u* r9 c, v
58. 
    * Y; A- b" ^4 n
59.         #navigation.simplepage { padding: 0; border-top: 2px solid #009DEA; border-bottom: 1px solid #009DEA; line-height: 25px; background: #EFF5FF; margin-bottom: 1em; }
    - x0 Z8 ^( o4 J$ ]- ]
60.                 #navigation.simplepage p { float: right; margin-right: 0.5em; }
    
61.                 .simplepage h2 { margin: 0; font-size: 1.2em; padding-left: 0.5em; }
    6 ^6 e. D  G. K, D  J$ }* J# f
62. 
    ( Y' S9 K3 }; Q
63. /*-----------------------------------------------------------------------------------布局*/
    
64. 
    
65. .content { /*三列布局*/
    
66.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y 0 0; }
    ) s& Y9 K$ q: Y% d4 d8 {2 s) t1 \* J
67.         /*\*/ * html .content { height: 1%; } /**/ *>.content { overflow: hidden; }
    9 ^1 h' o# ~; A+ J
68. .contentL { /*两列布局，侧边在左侧*/
    
69.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y -590px 0; }
    % N6 K6 A$ S& q8 T+ E
70.         /*\*/ * html .contentR { height: 1%; } /**/ *>.contentR { overflow: hidden; }
    
71. .contentR { /*两列布局，侧边在右侧*/
    
72.         width: 910px; background: #FFF url(../images/new/bg.gif) repeat-y 580px 0; }
    / s& ^& G% d6 O4 R9 u/ U8 N- {
73.         /*\*/ * html .contentR { height: 1%; } /**/ *>.contentR { overflow: hidden; }
    5 E! u3 W9 k* p' i: S# F  k& s
74. /*侧边样式*/
    ) i: E, l( d" K" a! O
75. .sideL { width: 296px; float: left; overflow: hidden; }
    ; q. g/ P, I! ^& K
76. .sideR { width: 202px; float: right; overflow: hidden; }
    
77. /*中间部分样式*/
    
78. .mainarea { margin: 0 4px; width: 382px; float: left; }
    9 g+ e6 p5 F& ?3 s8 f1 a0 e2 ?) ^. S
79.         .contentL .mainarea { margin: 0 0 0 4px; width: 556px; }
    
80.         .contentR .mainarea { margin: 0 4px 0 0; width: 576px; }
    
81. 
    
82. /*-----------------------------------------------------------------------------------版块样式*/
    
83. 
    
84. /*版块标题*/
    - }3 c. k4 P# @' p5 U& e
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; }
    % E& h( Y% G+ r* n( G7 X/ P9 H
87.         .blocktitle .more { margin-right: 5px; }
    
88. 
    
89. /*头条信息*/
    * a1 e8 B, \4 i" x7 ~
90. #headline { padding: 5px; height: 70px; he\ight: 58px; overflow: hidden; }
    ; P, ?$ E; B0 @( j5 L" R6 Y& ]
91.         #headline strong { font-size: 1.2em; }
    
92.         #headline p { margin: 0.3em 0; }
    
93.         #headline img { float: right; width: 48px; height: 48px; border: 4px solid #FFF; }
    + c5 w1 |; ?+ p3 J* d) ^7 o( Q
94. 
    1 Y* a5 S1 q' A# N
95. /*侧边版块*/
    
96. .sideblock { margin: 0 0 3px; border: 1px solid #86B9D6; background: #FFF; padding: 3px; }
    ) D$ {, `/ ?: K& y5 ^
97.         .boldblock { padding: 1px; background: #9FC8DF; } /*突出版块*/
    
98.         .cleanblock { border: 1px solid #86B9D6; margin: 0 0 4px; padding: 0; background: #F5FBFF; } /*简单版块*/
    2 b9 S1 _1 U4 [$ x0 t4 _4 C; [; E; t1 w
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; }
     
102.                         .headimg { float: right; margin: 5px 0 2px 5px; width: 80px; height: 80px; border: 4px solid #E2F0F9; }
     1 Y( I+ F+ D2 A7 w8 R/ d
103. 
     
104.         /*侧边多行列表*/
     
105.         .sideblock dl { margin: 0; padding: 5px; background: #FFF; line-height: 1.8em; }
     
106.                 /*\*/ * html .sideblock dl { position: relative; } /**/
     
107.                 .sideblock dt { padding-left: 0.8em; background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.7em; }
     & P- b* z: F* q; @4 Z6 u
108.                 .sideblock dd { color: #999; margin-left: 0.8em; }
     1 }4 C% ?, S8 B
109.                         .sideblock dd a { color: #999; }
     6 ]5 D3 Y7 J" n1 l
110. 
     , x  p& k' f- D* ^* d
111. /*单行信息列表*/
     2 n* k) R- @0 A% ^3 u$ N
112. .msgtitlelist { margin: 0; padding: 5px 0; list-style: none; line-height: 1.6em; }
     
113.         .msgtitlelist li { height: 1.6em; overflow: hidden; padding-left: 0.8em; background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.7em; }
     
114.         .mainarea .msgtitlelist { font-size: 1.2em; }
     
115.         .sideblock .msgtitlelist { background: #FFF; }
     # }9 t1 W9 V" P0 U% r4 t$ c8 P
116. 
     0 H0 [4 ^2 k2 `9 i: m/ _7 J& v
117. /*多行信息列表*/
     
118. .messagelist { margin: 5px 0; padding: 0; list-style: none; line-height: 1.6em; }
     
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; }
     , c# ^  q! [/ T( b7 J4 U
123.                 .messagelist li p { margin: 0; }
       P& F. H3 f  w/ [
124. 
     2 _, Q1 d; i$ l9 y: F' B( q3 x
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; }
     
128.                         .messagelist dd a { color: #999; }
     
129. 
     
130. /*热门话题*/
     7 `: }, R1 [2 [/ c
131. #hottag { overflow: hidden;  }
     * C3 [$ r" B4 d9 U% R, ~: U
132.         #hottag div { background: #FFF; padding: 0.5em; overflow: hidden; line-height: 1.8em; }
     
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; }
     
136. 
     , n( R6 n1 G5 ~* I+ V
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; }
     
141.                 #userpanel p { margin: 0.5em 0; }
     6 h! @! Y! O0 }; a
142.                 #dologin { float: right; }
     - o7 \) n+ B4 W- z: J  Q8 D7 j% ~
143.                 #userpanel form a { line-height: 2em; color: #B353B3; border-right: 1px solid #86B9D6; padding-right: 5px; }
     
144.         /*登录后*/
     ) w& a, F- K. u' X: F
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; }
     7 @* t7 i* Z/ }
147. 
     7 H6 k, a9 N$ p( h: M+ j
148. /*空间之星*/
     ' R- P3 p4 {7 l$ S) x& o$ ]0 B8 @
149. #spacestar ul { width: 168px; margin: 0 4px; padding: 0; height: 235px; }
     # e/ N! J9 E6 f  K5 r( @
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; }
     . U- ^  w" c0 ~
152.         #spacestar p { margin: -4px 0 !important; margin: 0 0; line-height: 20px; height: 20px; }
     8 w) h, a) R. z
153. 
     
154. /*同城空间*/
     
155. #cityspace { background: #F0F9FF; }
     
156. #cityspace form { width: 10.5em; margin: 0 auto; padding: 5px 0; }
     
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; }
     , H1 I, {) Q3 e5 z
160. 
     $ w, l' u/ ^5 {3 ?3 m1 y7 ~' U
161. /*空间排行*/
     . T6 F. ]* c- ?% y! |& q
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; }
     ) A6 q- s- y; J4 V
164.         #hotspace em { float: right; font-style: normal; font-size: 9px; color: #999; width: 40px; }
     
165. 
     
166. /*热门文章 */
     * U2 v7 L* K) Z
167. #hotarticle { border: 1px solid #86B9D6; background: #E2F0F9; padding: 3px; position: relative; }
       s9 f7 q  k- C
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; }
     . s+ A3 y7 P0 x, R; b
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; }
       H& X- [0 o# \- ?: M8 u- o
174. 
     
175. /*图片列表*/
     
176. .imgthumblist { margin: 0 3px; padding: 0; list-style: none; }
     / w5 I9 R. V3 j) I* z+ ?
177.         /*\*/ * html .imgthumblist { height: 1%; }/**/ *>.imgthumblist { overflow: hidden; }
     ' \$ D( f- H4 _6 W& y+ J
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; }
     ! e+ e+ H0 ^: E& ~
180.                         .imgthumblist li.list2line { height: 143px; height: 135px; }
       P1 S9 S" B2 O* k0 o+ L$ k
181.                         .contentL .imgthumblist li { margin: 0 1px 3px; }
     0 c- L. U* B8 T( G' i
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; }
     
190.         .goodsthumblist { margin: 0; padding: 3px 0; list-style: none; }
     
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; }
     3 O( V4 j6 i$ v' \
193.                         .goodsthumblist li p { margin: -3px 0 0 !important; margin: 0; height: 1.5em; line-height 1.5em; overflow: hidden; }
     
194. 
     8 P# v9 T5 @. J- M2 N$ l$ S
195. .imgtitlelist { margin: 10px 0; padding: 0; list-style: none; }
     : F% r1 N+ d+ Q( a# s
196.                 .imgtitlelist li { padding-left: 85px; padding-bottom: 5px; margin: 5px 0; border-bottom: 1px solid #E2F0F9; }
     + E5 F/ E' K8 l% X
197.                 /*\*/ * html .imgtitlelist li { height: 1%; } /**/ .imgtitlelist>li { overflow: hidden; }
     
198.                         .imgtitlelist li h4 { margin: 0.3em 0; font-size: 1em; }
     
199.                         .imgtitlelist li img { float: left; margin-left: -85px; width: 70px; height: 70px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED; }
     8 ~; G& `, D4 G* O4 q8 Y3 G: x
200.                         .imgtitlelist li p { margin: 0; line-height: 1.5em; }
     % M' l# [8 a6 @( P" U
201.         .sideblock .imgtitlelist li { padding-left: 65px; }
     
202.                 .sideblock .imgtitlelist li img { width: 48px; height: 48px; margin-left: -60px; }
     9 m0 m0 ^% ^- V" j5 h( _3 x
203.        
     
204. 
     
205. /*栏目区块列表*/
     
206. .category {  margin: 4px 0 10px 0; }
     8 A$ ^$ q* x( ^0 }9 e
207.         .category h3 { margin: 0 0 5px; font-size: 1.2em; line-height: 1.8em; height: 1.8em; border-bottom: 1px solid #86B9D6; }
     3 T- N9 E1 ^& g7 {' X$ l
208.                 .category h3 strong { background: #E9ECEF; float: left; padding: 0 8px; }
     8 q0 J& p- K/ M
209.                         .category h3 strong a { color: #333; text-decoration: none; }
     4 j4 n3 i) q5 R7 x* T
210.         /*.category ul { background: #FFF; margin: 0; padding: 4px 0 0 0; list-style: none; line-height: 1.6em; }
     . |$ {/ H! r$ M- L2 c* p
211.                 .category li { padding-left: 0.8em; background: url(../images/new/list_icon.gif) no-repeat 0.3em 0.7em; }
     + F! G& M  i. V3 L, c. z
212.         .catecommend { background: #F0F9FF; margin: 0; line-height: 2em; height: 2em; overflow: hidden; padding: 0 1em; }*/
     0 O5 @; Z* B6 [/ r% {6 }! [
213.                 .catecommend a { color: #000099; white-space: nowrap; margin-right: 0.5em; }
     
214. 
     
215. 
     
216. /*-----------------------------------------------------------------------------------首页各版块*/
     
217. 
     
218. /*#commendimage { height: 155px; }
     
219. #topicnews { height: 217px; }
     . q6 Y+ X- [. h5 i+ f, L
220. #newgoods, #commendgoods { height: 200px; }
     ! _$ v! U1 _" M6 k9 ]
221. #hotcommentfile, #hotfile, #newlink, #hotlink { height: 220px; }*/
     / J/ {! D" H' A7 c
222. 
     
223. 
     . B/ g" ]& l- X) k. h' c5 r
224. 
     
225. 
     $ o: q9 C# O& H; G$ j% S; R0 e: B
226. /*信息列表*/
     
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; }
     ! K1 {' E/ u# d
230.        
     * S! `/ Y* B- |7 `- L7 R* L7 B
231.         .articlelist ul { margin: 0; padding: 0; background: #FFF; padding-left: 5px; list-style: none; }
     4 J$ F  J# `6 r
232.                 .articlelist li { position: relative; padding-left: 60px; margin-top: 1em; }
     ( X3 ^- H  ?8 l$ C5 X; [0 {
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; }
     
236.                 .articlelist li img { position: absolute; left: 0!important; left: -67px; top: 0; border: 3px solid #9FC8DF; width: 48px; height: 48px; }
     & l) f( y$ y- c. X0 m1 ~" _
237.                
     8 }8 z* a% E. R$ t
238.                 .articlelist li strong { font-weight: normal; color: #999; line-height: 2em; padding-left: 0.5em; }
     7 \; [# Y) k- H, T% ^: \6 N0 c( I
239.                         .articlelist li strong a { color: #999; }
     5 _* B) ]9 R9 v: `3 Y) I# y
240.                 .articlelist li p { margin: 0.3em 0; line-height: 1.6em; }
     - v0 G) L" N" D* `! X) t
241.                         .articlelist li p a.more { float: none !important; }*/
     
242. 
     " D8 l, c, @4 u! k5 e& k3 W& i5 n
243. 
     * @5 R: I4 V( e
244. .catepic { text-align: center; }
     
245.         .catepic img { margin-top: 10px; padding: 3px; background: #F0F9FF; border: 1px solid #B9D0ED;
     2 A$ q3 m( I2 Y. @
246.                 max-width: 150px; max-height: 150px; width: expression(this.width > 150 ? 150: true); height: expression(this.height > 150 ? 150: true); }
     
247.         .catepic p { text-align: left; margin: 0.5em; }
     
248. 
       L9 S& u+ A- G- {  Z0 ?
249. /*专题列表*/
     
250. #subjectlist { border-color: #86B9D6; padding: 2px; }
     : l  \2 j' r5 A
251.         #subjectlist h3 { border: none; background: #9FC8DF; }
     
252.         #subjectlist li { border-bottom: 1px solid #E2F0F9; text-align: center; padding: 3px; }
     
253.                 #subjectlist p { margin: 0; line-height: 1.2em; }
     2 M& Q9 k7 W- x9 F: @0 ^- _
254. 
     
255. 
     6 z. t8 `8 u  P
256.         #xspace-rates { height: 2em; }
     ) s* V% ~9 c# P/ E; P
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; }
     + n, k6 E& |, H; W* U: F0 E- `
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; }
     # T: O4 I$ F5 q* U3 A3 u
261. 
     $ B$ I$ M+ w/ C: S( n# Y5 V
262. 
     
263. #panel { width: 600px; overflow: hidden; margin: 1em auto; }
     
264. 
     8 [/ L7 j! n9 @* m- U
265. 
     $ m* U! w! J! {- C
266. /*Pages*/
     # ?& ]* r/ y6 A" L' o
267. .pages { text-align: right; border-top: 1px solid #9FC8DF; }
     
268.         /*.pages table { margin: 3px 0 3px auto; text-align: center; }
     6 I. K) p# h# l4 Q. z* Z" u
269.                 .pages td { padding: 0 5px; border: 1px solid #B9D0ED; background: #FFF; }
     & J* ]$ F$ v  i1 _
270.                 .pages a { text-decoration: none; }
     3 t/ t" w3 w4 i$ P( p3 o  d
271.                 .pages .currentpage { background: #F0F9FF; border-color: #86B9D6; font-weight: bold; }*/
     
272. 
     - j' l# Q0 ]3 r- [, o+ l) p3 e: ~$ G
273. /* 分页 */
     . h* s/ _# h3 t8 V) 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; }
     
276.                 table.xspace-page a:hover { background: #86B9D6; }
     ( Z$ I+ r' y# t8 M% b. s# n
277.         table.xspace-page td.xspace-current { background: #86B9D6; padding: 0.3em 0.5em; font-weight: bold; }
     ! ~; `' t: l. x+ F, k# q; J
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; }
     $ s7 M) O; s2 C
281.         .smalltxt a, .smalltxt a:visited { color: #999 !important; }
     9 I8 N2 J1 u6 ]3 @/ E' w
282. 
     * U9 A5 @, e9 T  N
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; }
     % f6 E4 d+ B" A
285.         #footer p { margin: 0.3em 0; color: #999; }
     ! ^% H& R$ M* }$ a7 U
286.         #footer strong { color: #007AB6; }
     
287.         #footer em { font-style: normal; font-weight: bold; color: #96A800; }
     & o6 t, V" F: c! e, c# ]3 N4 X, v
288.        
     
289. .imglogolist { margin: 0; padding: 0; list-style: none; text-align: center; }
     ; B+ T$ U* p4 ^7 S& d
290.        
     % H2 l4 w) U! B7 V# X' e2 k
291. #articledetail { border: 1px solid #86B9D6; text-align: center; }
     % b5 q+ t+ f! {& V0 F
292. .articletitle { font-size: 1.6em; margin: 1em 0 0.5em; }
     
293. .articleinfo { border-bottom: 1px solid #9FC8DF; margin: 0;}
     8 P# P) ^: x2 r6 \3 Q' S+ I6 Y. J
294. .articlectrl { margin: 0.5em 0 1.5em; }
     
295. 
     0 j+ X2 _" A( Z$ M
296.         #articlebody { width: 98%; margin: 0 auto; overflow: hidden; text-align: left; overflow-y: hidden; line-height: 1.8em; font-size: 1.2em; }
     , z  l/ K; y9 ]
297.         #articlebody * { line-height: normal; }
     
298.                 #articlebody  p, #articlebody  div { line-height: 1.8em !important; margin: 10px 0; }
     * K) \! H4 v2 H0 ~! L! _* f
299.                         #articlebody  p *, #articlebody  div * { line-height: normal !important; }
     4 R. p: V, R3 N: I( ~: q  R
300.        
     , u( O& {5 m1 o' a
301.         #articlebody .addoninfo { border: 1px solid #EEE; }
     ) \$ `9 f* P# p; L/ w
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; }
     
304.                         #articlebody .addoninfo li { line-height: 1.6em !important; }
     
305.        
     
306.         #articlebody img { width: expression(this.width > 500 ? 500: true); max-width: 500px;  }
     
307.        
     
308.         #articlebody kbd.showvideo, #articlebody kbd.showflash { font: 1em Arial, Helvetica, sans-serif; cursor: pointer; text-decoration: underline; }
     ' t! w9 U9 {4 q3 Y; ~6 T
309.         #commentlist { overflow: hidden; border: 1px solid #86B9D6; margin: 4px 0 0; padding: 0 5px; }
     + d" X/ h" M" W- Y
310.                 #commentlist h3 { font-size: 1em; line-height: 2em; margin: 0; background: #F0F9FF; border-bottom: 1px solid #86B9D6; }
     * a2 K- O. @: t* [: P
311.                                 #commentlist img { max-width: 500px; width: expression(this.width > 500 ? 500: true); }
     
312.                         #commentlist .messagelist li div { width: 98%; margin: 0 auto; overflow: hidden; text-align: left; overflow-y: hidden; line-height: 1.8em; }
       ]+ {" e* j9 c+ a
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; }
     " K- k. ~( ?! Y$ L1 o$ `
315.                                                 #commentlist .messagelist li div  p *, #commentlist .messagelist li div  div * { line-height: normal !important; }
     4 t1 G" Q6 h- X8 c; V
316. 
     2 |9 F1 j/ @' v* K- T$ m& M  g
317. /*发表评论*/
     2 q# T& v% @8 l% A# |
318. #comment { margin-top: 4px; }
     ) @. J0 E* n, z: Y' S& k$ `. V
319.         #comment h3 { margin: 0 5px; font-size: 1em; line-height: 2em; }
     ! Y7 t, ?4 S) q: I  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; }
     
324.                 #xspace-rates label { float: left; line-height: 24px; margin-right: 5px; }
     ) g1 I/ C3 H& j5 u
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; }
     $ c& d! \8 t  z2 s. k( a, b
327.                         .xspace-rates-5 #xspace-rate-5, .xspace-rates-3 #xspace-rate-3, .xspace-rates-1 #xspace-rate-1, .xspace-rates0 #xspace-rate0, .xspace-rates1 #xspace-rate1, .xspace-rates3 #xspace-rate3, .xspace-rates5 #xspace-rate5 { background: #DDD; border-color: #BBB; font-weight: bold; }
     
328. 
     
329. /*AJAX div*/
     2 q6 S7 H9 B7 Y$ F/ ]. m8 P; O
330. .xspace-ajaxdiv { position:absolute; padding: 5px; border: 1px solid #BBB; background: #FCFFEF; text-align: left; }
     
331.         .xspace-ajaxdiv h5 { line-height: 24px; font-size: 1em; margin: 0; }
     
332.                 .xspace-ajaxdiv h5 a { float: right; font-weight: normal; }
     
333.         .xspace-ajaxcontent { background: #FFF; border: 1px solid #EEE; }
     
334.                 .xspace-ajaxcontent form { margin: 0; }

复制代码

傲天♂浪子追风

1. /*-----------------------------------------------------------------------------------综合设置*/
   3 Y. a- j% G9 ~( S
2. 
   " _$ H. {6 F" z, Q) H$ z7 V. n
3. body { margin: 0; background: #FFF; color: #333; text-align: center; font: 12px Arial, Helvetica, sans-serif; }
   * l- O5 Q3 R; s! D( c7 U- l. x2 U
4. #wrap { background: #FFF; margin: 0 auto; text-align: left; width: 910px; padding: 0 4px; w\idth: 910px; }
   * N% t4 A* {; Q! I3 L, F% n& h% f/ }3 T
5. 
   8 d3 Z5 x; w2 ~; @$ V

复制代码

4 F. R" E. D4 I
/ [1 h) d" U+ V分析

1. margin属性说明：
   
2. 
   + v; S4 s3 j; o! c3 o
3. 检索或设置对象四边的外延边距。
   
4. 如果提供全部四个参数值，将按上－右－下－左的顺序作用于四边。
   
5. 如果只提供一个，将用于全部的四边。
   
6. 如果提供两个，第一个用于上－下，第二个用于左－右。
   
7. 如果提供三个，第一个用于上，第二个用于左－右，第三个用于下。
   ( V5 U( e, t& A+ q
8. 内联对象要使用该属性，必须先设定对象的height或width属性，或者设定position属性为absolute。
   ! _5 ^/ K/ a3 B
9. 在IE4+，margin属性不可用于td和tr对象。
   + L0 g. B: s& h. w. b$ m# y. _  w* G
10. 外延边距始终透明。
    
11. 
    2 c( i' y. ~# Q% H+ ^
12. color : 　指定颜色
    8 Z& \. ?% A0 y! o
13. text-align:文本的对齐方式。(left : 　左对齐,right : 　右对齐,center : 　居中,justify : 　两端对齐)
    
14. font: 12px Arial, Helvetica, sans-serif;  :这段是字体相关的
    6 u! y9 [% e) v2 @  b. `4 T9 l
15. 
    
16. 
    

复制代码

傲天♂浪子追风

1. /*链接样式*/
   2 X' V/ Z% l- ?/ o+ P" H
2. a { color: #000; text-decoration: none; }
   3 h; b8 L& H( ?- |
3.         a:hover { text-decoration: underline; color: #000098; }
   
4.                 a:visited { color: #666;}
   3 q0 M' @  G' q+ W. @
5.         #topmenu a, #menu a, .imglist a, #hotspace li a { text-decoration: none; }
   
6.                 #topmenu a:hover, #menu a:hover, .imglist a:hover, #hotspace li a:hover { text-decoration: underline; }
   
7.         a img { border: none; }
   5 n$ f9 X; g; p8 g0 ]5 G
8. li cite { font-style: normal; font-size: 12px; float: right; width: 4em; color: #999; }
   7 K/ Z. A: k* Y
9.         li cite a { color: #999; }
   2 z5 [% N+ \# _( a" W& I
10.                 li cite a:visited { color: #999; }
    7 X: Q$ w1 P6 y: M
11. .more { float: right !important; color: #000098 !important; background: transparent !important; font-size: 12px !important; font-weight: normal !important; cursor: pointer; }
    / D% v& @! Q; i& y# q2 x
12. 
    

复制代码

# E: n1 F5 J& K: A0 O
分析

3 K) e& O" D5 C! ~& w* O

1. 
   
2. text-decoration:文本连接的属性,一般有以下几种参数:
   
3. none : 　无装饰
   
4. blink : 　闪烁
   
5. underline : 　下划线
   
6. line-through : 　贯穿线
   
7. overline : 　上划线
   5 j3 d1 D6 A$ f6 ~* Y/ I
8. 
   3 _6 a) O. S( ?0 I) x. V* X
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; }:
    
16. 上面这两行是与鼠标相关
    
17. 
    8 j* B2 s! w5 P- g. F9 g
18. a img { border: none; }图片连接相关
    
19. 
    
20. 
    * O# j* D. o0 I/ @5 E
21. cite:这个一般是引用标签的时候用的,不知道用来这里做什么
    9 {7 b/ e1 j, `* V" @0 t; t
22. 
    
23. 
    
24. font-style:字体式样,一般常用参数有:
    * u, t/ {9 D" K' t2 b6 C$ [* R( ~
25. normal : 正常的字体
    
26. italic : 斜体。对于没有斜体变量的特殊字体，将应用oblique
    0 V* u0 K$ m- w1 J, w
27. oblique : 倾斜的字体
    ) z0 L. }, |0 k3 M0 v6 h& d
28. 
    . {) a2 `' C2 q- f
29. 
    . N) U4 b; @: b6 g4 I
30. float: right 该属性的值指出了对象是否浮动及如何浮动。常用参数如下:
    ) L. ?9 t5 C6 W! h6 K8 L
31. none : 　对象不浮动
    
32. left : 　对象浮在左边
    
33. right : 　对象浮在右边
    
34. 
    
35. 
    
36. important:样式表条目,提升指定样式规则的应用优先权。
    
37. 
    ( ~' G5 ^; S( i3 P: q( R
38. 
    
39. background: transparent 这个的意思就是背景透明...
    % q- z1 ~1 u* B
40. 
    % ~. l- P5 Q% [5 u( L: Z; W; A
41. 
    2 f1 ~& j% k1 I: R
42. 
    
43. font-weight: normal :文本字体的粗细,常用参数如下:
    $ f; V, Q+ u* c% M) i7 N* L
44. normal : 正常的字体。相当于number为400。声明此值将取消之前任何设置
    1 b9 f9 R8 f5 D
45. bold : 粗体。相当于number为700。也相当于b对象的作用
    % C: Z8 n2 e* \/ o" Q
46. bolder : IE5+　特粗体
    1 j2 |& \2 R1 G6 |- w- L$ Q1 P
47. lighter : IE5+　细体
    
48. number : IE5+　100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
    
49. 
    
50. cursor: pointer:这个是鼠标放在对象中的状态,简单点来可以这样说,也就是鼠标放在连接上的时候显示的鼠标形状,一般有以下N种参数,这个真的是TMD的多啊
    , l) G5 g. j1 @/ O+ t
51. 语法：(每一竖隔开为一个状态)
    
52. cursor : auto | crosshair | default | hand | move | help | wait | text | w-resize |s-resize | n-resize |e-resize | ne-resize |sw-resize | se-resize | nw-resize |pointer | url (url)
      Z! I7 ~3 F' X# S. a5 s' {8 \! {
53. 
    : t! s- z+ I' }3 \$ K# W, Y
54. 
    
55. 
    
56. 
    8 i" p, @) M0 A/ P/ B: E
57. 
    
58. 
    
59. 
    - ~& R+ ]6 {4 P" ~3 Q) c

复制代码

傲天♂浪子追风

1. /*-----------------------------------------------------------------------------------表单通用样式*/
   # K; n0 \$ e0 o4 @" E
2. 
   
3. form { margin: 0; }
   ) a7 Z# P* D6 H
4.         input, textarea, button, select { font: 1em Arial, Helvetica, sans-serif; }
   ; m$ m) D: Y$ v: n6 j% z
5.         button { height: 1.8em; padding: 0 0.3em; background: #9FC8DF; cursor: pointer; border: 1px solid;
   / j6 R9 `; d: }% a
6.                 border-top-color: #C9E3F0; border-right-color: #2A8ABA; border-bottom-color: #2A8ABA; border-left-color: #C9E3F0; }
   
7.         fieldset { border: 0; padding: 0; }
   9 i' E, P& |  p' ^; {
8.                 legend { display: none; }
   
9.         label { cursor: pointer; margin-right: 0.5em; }
   ! P6 g& ^, n' ~" K

复制代码

bronwen

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

傲天♂浪子追风

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

傲天♂疯紫

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