1 @charset "utf-8";
2 /*=========================Reset_start==========================*/
3 body,h1,h2,h3,h4,h5,h6,div,p,dl,dt,dd,ol,ul,li,form,table,th,td,a,img,span,strong,var,em,input,textarea,select,option
4 {
5 margin: 0; padding: 0;
6 }
7 body{
8 background: #eeeeee;
9 }
10 html,body
11 {
12 font-family:"微软雅黑","宋体",Arail,Tabhoma;
13 text-align: left;
14 }
15 ul,ol
16 {
17 list-style: none;
18 }
19 img
20 {
21 border: 0 none;/*浏览器兼容问题，边框问题*/
22 }
23 input,select,textarea
24 {
25 outline:0;/*去除外面的实线*/
26 }
27 textarea
28 {
29 resize:none;/*固定文本框*/
30 overflow: auto;/*自定义的出现滚动条*/
31 }
32 table
33 {
34 border-collapse: collapse;
35 border-spacing: 0;
36 }
37 th,strong,var,em
38 {
39 font-weight: normal;
40 font-style: normal;
41 }
42 a
43 {
44 text-decoration: none;
45 color: black;
46 }
47
48 /*==========================Reset_End===========================*/
reset.css
1 ._head
2 {
3 width: 1200px;
4 background: #fff;
5 margin: 0px auto;
6 min-width: 1200px;
7 }
8 ._head_top
9 {
10 width: 1200px;
11 height: 32px;
12 }
13 ._head_top_left
14 {
15 float: left;
16 margin-left: 60px;
17 height: 32px;
18 }
19 ._head_top_left li
20 {
21 float: left;
22 }
23 ._head_top_left li a
24 {
25 line-height: 32px;
26 }
27 ._head_top_left_l1
28 {
29 padding-right: 14px;
30 }
31 ._head_top_left_l3
32 {
33 padding-left: 11px;
34 }
35 ._head_top_right
36 {
37 float: right;
38 margin-right: 33px;
39 width: 380px;
40 height: 32px;
41 }
42 ._head_top_right li
43 {
44 float: left;
45 height: 32px;
46 line-height: 32px;
47 color: #666666;
48 }
49 ._head_bottom
50 {
51 width: 1200px;
52 height: 122px;
53 }
54 ._head_bottom_bg
55 {
56 height: 122px;
57 background: url(../images/head_sanceng.jpg) 0 0 repeat-x;
58 overflow: hidden;
59 }
60 ._head_bottom_left
61 {
62 float: left;
63 width: 88px;
64 height: 96px;
65 padding-top: 23px;
66 padding-left: 8px;
67 }
68 ._head_bottom_center
69 {
70 float: left;
71 padding-top:79px;
72 width: 239px;
73 height: 33px;
74 margin-left: 4px;
75 color: #787878;
76 }
77 ._head_bottom_right
78 {
79 float: left;
80 width: 842px;
81 height: 85px;
82 padding-top: 32px;
83 margin-left: 19px;
84 }
85 ._head_bottom_right ul
86 {
87 width: 727px;
88 height: 40px;
89 overflow: hidden;
90 color: #333333;
91 font-size: 18px;
92 font-weight: bold;
93 }
94 ._head_bottom_right ul li
95 {
96 float: left;
97 }
98 ._head_bottom_right_box
99 {
100 width: 842px;
101 height: 50px;
102 overflow: hidden;
103 }
104 ._head_bottom_right_box2
105 {
106 width: 98px;
107 height: 48px;
108 border: 1px solid #d9b997;
109 background: #f78c19;
110 float: left;
111 margin-left: 8px;
112 text-align: center;
113 line-height: 48px;
114 color: #fff;
115 cursor: pointer;
116 }
117 ._head_bottom_right_box1
118 {
119 width: 725px;
120 height: 48px;
121 border: 1px solid #dadada;
122 float: left;
123 }
124 ._head_bottom_right_box1 div
125 {
126 width: 143px;
127 height: 48px;
128 border-right: 1px solid #dbdbdb;
129 float: left;
130 }
131 ._head_bottom_right_box1_pro
132 {
133 line-height: 48px;
134 padding-left: 28px;
135 padding-right: 20px;
136 }
137 ._head_bottom_right_box1 input
138 {
139 width: 581px;
140 height: 48px;
141 float: left;
142 border: 0px;
143 color: #a3a2a2;
144 }
head.css
1 ._foot
2 {
3 width: 1200px;
4 margin-top: 1px;
5 min-width: 1200px;
6 margin: 0 auto;
7 }
8 ._foot_top
9 {
10 width: 1200px;
11 height: 250px;
12 }
13 ._foot_top_bg
14 {
15 width: 979px;
16 height: 223px;
17 margin: 0 auto;
18 margin-top: 28px;
19 }
20 ._foot_top_bg ul
21 {
22 margin-right: 130px;
23 float: left;
24 color: #999999;
25 }
26 ._foot_top_u1 li
27 {
28 margin-bottom: 13px;
29 }
30 ._foot_top_bg ._foot_top_u1_l
31 {
32 color: #333333;
33 margin-bottom: 24px;
34 }
35 ._foot_center
36 {
37 width: 1179px;
38 height: 58px;
39 border-top: 1px solid #c9c9c9;
40 border-bottom: 1px solid #c9c9c9;
41 }
42 ._foot_center ul
43 {
44 width: 1000px;
45 height: 58px;
46 margin-left: 96px;
47 line-height: 58px;
48 }
49 ._foot_center ul li
50 {
51 float: left;
52 }
53 ._foot_center ul li img
54 {
55 width: 35px;
56 height: 35px;
57 margin-right: 8px;
58 margin-top: 13px;
59 }
60 ._foot_center_peo
61 {
62 background: url(../images/foot_people.png) 0px 16px no-repeat;
63 padding-left: 32px;
64 }
65 ._foot_bottom
66 {
67 width: 1200px;
68 height: 138px;
69 }
70 ._foot_bottom ul
71 {
72 width: 800px;
73 height: 78px;
74 margin: 0 auto;
75 }
76 ._foot_bottom ul
77 {
78 overflow: hidden;
79 }
80 ._foot_bottom li
81 {
82 float: left;
83 margin-bottom: 4px;
84 color: #a6a6a6;
85 }
foot.css
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>Title</title>
6 <link rel="stylesheet" href="css/reset.css">
7 <link rel="stylesheet" href="css/head.css">
8 <link rel="stylesheet" href="css/foot.css">
9 <link rel="stylesheet" href="css/information.css">
10 <style>
11 ._main_imgs
12 {
13 width: 1200px;
14 height: 141px;
15 margin: 0 auto;
16 min-width: 1200px;
17 }
18 ._main_imgs img
19 {
20 width: 1200px;
21 height: 141px;
22 }
23 </style>
24 </head>
25 <body>
26 <div class="_head">
27 <div class="_head_top">
28 <ul class="_head_top_left">
29 <li class="_head_top_left_l1">
30 <a href="javascript:;" style="color:#1a2f72">Sign In</a>
31 </li>
32 <li>
33 <a href="javascript:;" style="color:#dfdfdf">|</a>
34 </li>
35 <li class="_head_top_left_l3">
36 <a href="javascript:;" style="color:#1a2f72">Join Free</a>
37 </li>
38 </ul>
39 <ul class="_head_top_right">
40 <li><span style=‘padding-right:9px‘>For Buyers</span><span>∨</span></li>
41 <li><span style=‘padding-left:34px;padding-right:9px‘>For Suppliers</span><span>∨</span></li>
42 <li><span style=‘padding-left:47px;padding-right:10px‘>English</span><span>∨</span></li>
43 </ul>
44 </div>
45 <div class="_head_bottom">
46 <div class="_head_bottom_bg">
47 <div class="_head_bottom_left">
48 <a href="javascript:;"><img src="images/head_left.png" alt=""></a>
49 </div>
50 <div class="_head_bottom_center">
51 <p>For sino industry products</p>
52 <p>business and trade information</p>
53 </div>
54 <div class="_head_bottom_right">
55 <ul>
56 <li><span style=‘padding-left:11px;padding-right:70px;‘>Home</span></li>
57 <li><span style=‘padding-right:17px;‘>Information</span><span>∨</span></li>
58 <li><span style=‘padding-left:58px;padding-right:16px;‘>Product</span><span>∨</span></li>
59 <li><span style=‘padding-left:69px;padding-right:18px;‘>Suppliers</span><span>∨</span></li>
60 <li><span style=‘padding-left:30px;‘>Service</span></li>
61 </ul>
62 <div class="_head_bottom_right_box">
63 <div class="_head_bottom_right_box1">
64 <div>
65 <span class=‘_head_bottom_right_box1_pro‘>Product</span>
66 <span> <img src="images/head_daosanjiao.png" alt=""></span>
67 </div>
68 <input type="text" value=" Please enter the contenr you want to search">
69 </div>
70 <div class="_head_bottom_right_box2">
71 <p>SEARCH</p>
72 </div>
73 </div>
74 </div>
75 </div>
76 </div>
77 </div>
78 <div class="_main">
79 <div class="_main_left">
80 <p class="_main_left_top"> Home> Information</p>
81 <ul>
82 <li class="_main_left_cote"><p>Cotegories</p></li>
83 <li style="background:#f78c19;"><a href="javascript:;">Maket</a></li>
84 <li><a href="javascript:;">Dynamic</a></li>
85 <li><a href="javascript:;">Exhibition</a></li>
86 <li><a href="javascript:;">Project</a></li>
87 </ul>
88 </div>
89 <div class="_main_center">
90 <div class="_main_center_top">
91 <div class="_main_center_top_left"><img src="images/information_tong.jpg" alt=""></div>
92 <ul class="_main_center_top_right">
93 <li>
94 <a href="javascript:;" style="font-size:14px;font-weight:bold">Exclusive: OPEC president says output freeze will work</a>
95 </li>
96 <li>
97 <a href="javascript:;" style="font-size:14px;">Oil prices could move back above $50 a barrel within a</a>
98 </li>
99 <li>
100 <a href="javascript:;" style="font-size:14px;">year as an OPEC initiative to freeze production gains</a>
101 </li>
102 <li>
103 <a href="javascript:;" style="font-size:14px;">support, and smaller producers go to the wall.</a>
104 </li>
105 <li>
106 <a href="javascript:;" style="font-size:14px;">2016-02-25</a>
107 </li>
108 </ul>
109 </div>
110 <div class="_main_center_middle">
111 <ul>
112 <li>
113 <span>Apple to court: Government cant force us to write code</span>
114 <span class=‘_main_center_middle_sp‘>
115 2016-02-26
116 </span>
117 </li>
118 <li>
119 <span>Apple to court: Government cant force us to write code</span>
120 <span class=‘_main_center_middle_sp‘>
121 2016-02-26
122 </span>
123 </li>
124 <li>
125 <span>Apple to court: Government cant force us to write code</span>
126 <span class=‘_main_center_middle_sp‘>
127 2016-02-26
128 </span>
129 </li>
130 <li>
131 <span>Apple to court: Government cant force us to write code</span>
132 <span class=‘_main_center_middle_sp‘>
133 2016-02-26
134 </span>
135 </li>
136 <li>
137 <span>Apple to court: Government cant force us to write code</span>
138 <span class=‘_main_center_middle_sp‘>
139 2016-02-26
140 </span>
141 </li>
142 <li>
143 <span>Apple to court: Government cant force us to write code</span>
144 <span class=‘_main_center_middle_sp‘>
145 2016-02-26
146 </span>
147 </li>
148 <li>
149 <span>Apple to court: Government cant force us to write code</span>
150 <span class=‘_main_center_middle_sp‘>
151 2016-02-26
152 </span>
153 </li>
154 <li>
155 <span>Apple to court: Government cant force us to write code</span>
156 <span class=‘_main_center_middle_sp‘>
157 2016-02-26
158 </span>
159 </li>
160 </ul>
161 </div>
162 <div class="_main_center_bottom">
163 <ul>
164 <li>First </li>
165 <span>| </span>
166 <li>Previous </li>
167 <span>| </span>
168 <li>Next </li>
169 <span>| </span>
170 <li style="padding-right:22px">Last </li>
171 <li>Page to : </li>
172 <li><select name="" id="" style="width:66px;height:20px"></select></li>
173 </ul>
174 </div>
175 </div>
176 <div class="_main_right">
177 <ul>
178 <li class=‘_main_right_l1‘>
179 <p></p>
180 <span>Hot</span>
181 </li>
182 <li class="_main_right_l2">
183 <img src="images/information_oil.jpg" alt="">
184 </li>
185 <li class="_main_right_l3">
186 <p>Oil crash: Halliburton slashes</p>
187 <p>another 5,000 jobs</p>
188 </li>
189 <li class="_main_right_l4">
190 <img src="images/information_women.jpg" alt="">
191 </li>
192 <li class="_main_right_l3">
193 <p>Oil crash: Halliburton slashes</p>
194 <p>another 5,000 jobs</p>
195 </li>
196 <li class="_main_right_l6">
197 <p>ADVERTISING</p>
198 </li>
199 <li class="_main_right_l7">
200 <img src="images/information_news.jpg" alt="">
201 </li>
202 </ul>
203 </div>
204 </div>
205 <div class="_main_imgs">
206 <img src="images/information_bg.jpg" alt="">
207 </div>
208 <div class="_foot">
209 <div class="_foot_top">
210 <div class="_foot_top_bg">
211 <ul>
212 <li class="_foot_top_u1_l">Information</li>
213 <li>Market</li>
214 <li>Dynamic</li>
215 <li>Exhibition</li>
216 <li>Project</li>
217 </ul>
218 <ul>
219 <li class="_foot_top_u1_l">Products</li>
220 <li>Environmental Protection</li>
221 <li>Ironmaking</li>
222 <li>Steelmaking</li>
223 <li>Rolling</li>
224 <li>Refractory</li>
225 <li>Others</li>
226 </ul>
227 <ul>
228 <li class="_foot_top_u1_l">Seller</li>
229 <li>Environmental Protection</li>
230 <li>Ironmaking</li>
231 <li>Steelmaking</li>
232 <li>Rolling</li>
233 <li>Refractory</li>
234 <li>Others</li>
235 </ul>
236 <ul style="margin-right:0px;">
237 <li class="_foot_top_u1_l">Service</li>
238 <li>Online Service</li>
239 <li>Online Service</li>
240 <li>VAS</li>
241 </ul>
242 </div>
243 </div>
244 <div class="_foot_center">
245 <ul>
246 <li style="margin-right:34px">Follow Us :</li>
247 <li><img src="images/foot_f.png" alt=""></li>
248 <li><img src="images/foot_in.png" alt=""></li>
249 <li><img src="images/foot_k.png" alt=""></li>
250 <li><img src="images/foot_+.png" alt=""></li>
251 <li><img src="images/foot_weibo.png" alt=""></li>
252 <li><img src="images/foot_you.png" alt=""></li>
253 <li style="margin-left:142px">Service hotline: </li>
254 <li style="color:#999999;margin-right:115px">400-8603-139</li>
255 <li class="_foot_center_peo">Contact Us</li>
256 </ul>
257 </div>
258 <div class="_foot_bottom">
259 <ul>
260 <li class="_foot_bottom_l1">Copyright © 2006 ibicn.com Inc. All rights reserved</li>
261 <li>Beijing public security ICP Card No. 11010602100087 Beijing Beijing No. 120067 ICP No. 09020853 - 112</li>
262 <li>Beijing United Media Information & Technology Corp</li>
263 </ul>
264 </div>
265 </div>
266 <!-- ********* -->
267 <script>
268
269 </script>
270 </body>
271 </html>
information.html
时间： 2024-10-13 18:03:36