这个是上一个帖子的样式部分
*{
margin: 0;
padding: 0;
}
ul{
list-style-type: none;
}
a{
text-decoration: none;
}
#header{
width: 1349px;
height:170px;
background-color: #eee;
margin: 0 auto;
}
#header_main{
width:1002px;
height:155px;
margin: 0 auto;
position: relative;
}
#header_main #header_logo{
width: 216px;
height: 144px;
background-color: #aaeecc;
position: absolute;
left: 0;
top: 0;
}
#header_main #header_img{
width:231px;
height:95px;
background-color: #aaeecc;
position: absolute;
right: 0;
top:0;
}
#header_main #header_nav{
width: 768px;
height: 46px;
position: absolute;
bottom: 0;
right: 0;
}
#header_main #header_nav li{
float: left;
width:96px;
height:46px;
text-align: center;
line-height: 46px;
}
#header_main #header_nav li a{
text-decoration: none;
color: #000;
font-size: 18px;
display: block;
width:96px;
height: 46px;
}
#header_main #header_nav li a:hover{
background-color: red;
color:#fff;
}
#header_foot{
width: 1349px;
height:15px;
margin: 0 auto;
background-color: #ff0000;
}
#main{
width:1002px;
margin: 0 auto;
}
#main #banner{
width :1002px;
height:344px;
background-color:#eee;
box-shadow: 0 10px 20px #999;
}
#main #content{
width:1002px;
height:460px;
margin-top: 20px;
}
#main .content_com{
height:460px;
float: left;
}
#main #content #content_showcase{
width: 730px;
margin-right: 2px;
}
#main #content #content_news{
width: 260px;
margin-left:10px;
}
#main .content_top{
height:60px;
}
#main .content_bot{
height:390px;
margin-top:10px;
}
#content_showcase_top_l{
width:120px;
height: 49px;
margin-top: 11px;
float: left;
background-image: url("images/content_l.png");
}
#content_showcase_top_r{
width:610px;
height: 49px;
margin-top: 14px;
float: left;
background-image: url("images/2.png");
}
#content_news_top_l{
width:190px;
height: 49px;
margin-top: 11px;
float: left;
background-image: url("images/content_r.png");
}
#content_news_top_r{
width:70px;
height: 60px;
position: relative;
float: left;
}
#content_showcase_top {position: relative;}
#more{
position: absolute;
width:50px;
height:20px;
bottom:20px;
right: 0px;
}
#more a{
display: block;
width:50px;
height: 20px;
background-image: url("images/3.png");
background-position: -18px -7px;
}
#content_news_top_r_top{
width:50px;
height:20px;
position: absolute;
top:20px;
right: 0;
}
#content_news_top_r_top a{
display: block;
width:50px;
height: 20px;
background-image: url("images/3.png");
background-position: -18px -7px;
}
#content_news_top_r_bot{
width:70px;
height:20px;
position: absolute;
bottom: 0;
right: 0;
background-image: url("images/3.png");
background-position: 0 -27px;
}
#content_news_bot{
}
#content_news_bot #news_top{
width:255px;
height:65px;
background-image:url("images/news_top.png") ;
margin:0 auto;
}
#content_news_bot #news_content{
width:270px;
height:20px;
margin-top: 5px;
}
#content_news_bot #news_content ul{
margin-left: 5px;
}
#content_news_bot #news_content li{
float: left;
}
#content_news_bot #news_content a{
text-decoration: none;
text-align: center;
line-height: 18px;
display: block;
width:40px;
height:18px;
background-color: #666;
margin-left: 1px;
color: #fff;
font-size: 12px;
}
#content_news_bot #news_content a:hover{
background-color: red;
}
#content_news_bot #news_bot{
width: 270px;
height: 290px;
}
#content_news_bot #news_bot dd{
width: 260px;
height: 90px;
margin-top: 10px;
}
#content_news_bot #news_bot dd b{
font-size: 16px;
font-weight: block;
}
#content_news_bot #news_bot dd p{
font-size: 14px;
line-height: 17px;
}
#content_news_bot #news_bot dd a{
background-color: #eee;
text-decoration: none;
width:10px;
}
#content_news_bot #news_bot dd hr{
margin-top: 10px;
}
#content #content_showcase_bot li{
width:235px;
height: 180px;
float: left;
margin-top:10px;
}
#content #content_showcase_bot .LI{
margin-left: 12px;
margin-right: 12px;
}
#content #content_showcase_bot img{
width:225px;
height: 140px;
padding: 5px;
border: 1px solid #bbb;
}
#content #content_showcase_bot p{
margin-top:1px;
height: 29px;
color: #000;
text-align: center;
line-height: 29px;
background-color: #eee;
}
#bot{
width: 1002px;
height:400px;
margin-top: 20px;
}
.bot_top{
height:50px;
}
.bot_bot{
height:330px;
margin-top:20px;
}
#bot #bot_disigner{
width: 410px;
height: 400px;
float: left;
}
#bot #bot_disigner_box{
width:410px;
height:330px;
}
#bot #bot_disigner_box ul{
width:410px;
height:165px;
}
#bot #bot_disigner_box li{
float: left;
}
#bot #bot_disigner_box li a{
display: block;
width:120px;
height: 155px;
}
#bot #bot_disigner_box li a img{
width:120px;
height: 155px;
}
#bot #bot_disigner_box .A{
padding-right: 10px;
padding-bottom: 8px;
border-right: 1px solid #bbb;
border-bottom: 1px solid #bbb;
}
#bot #bot_disigner_box .B{
padding-right: 10px;
padding-left: 10px;
padding-bottom: 8px;
border-bottom: 1px solid #bbb;
}
#bot #bot_disigner_box .C{
padding-left: 10px;
padding-bottom: 8px;
border-left: 1px solid #bbb;
border-bottom: 1px solid #bbb;
}
#bot #bot_disigner_box .D{
padding-right: 10px;
padding-top: 8px;
border-right: 1px solid #bbb;
}
#bot #bot_disigner_box .E{
padding-right: 10px;
padding-left: 10px;
padding-top: 8px;
}
#bot #bot_disigner_box .F{
padding-left: 10px;
padding-top: 8px;
border-left: 1px solid #bbb;
}
#bot #bot_about{
width: 312px;
height: 400px;
float: left;
margin:0 5px;
}
#bot #bot_contact{
width: 270px;
height: 400px;
float: left;
}
#bot #more{
position: absolute;
width:50px;
height:20px;
bottom:5px;
right: 0px;
}
#bot #more a{
display: block;
width:50px;
height: 20px;
background-image: url("images/3.png");
background-position: -18px -10px;
}
#bot_disigner_top,#bot_about_top,#bot_contact_top{position: relative;}
#bot_disigner_top_l,#bot_about_top_l,#bot_contact_top_l{
width:120px;
height: 49px;
margin-top: 11px;
float: left;
}
#bot_disigner_top_l{background-image: url("images/disigner.png");}
#bot_about_top_l{background-image: url("images/aboutus.png");}
#bot_contact_top_l{background-image: url("images/contactus.png"); }
#bot_disigner_top_r,#bot_about_top_r,#bot_contact_top_r{
height: 49px;
margin-top: 15px;
float: left;
background-image: url("images/2.png");
}
#bot_disigner_top_r{width:290px;}
#bot_about_top_r{width:192px;}
#bot_contact_top_r{width:150px;margin-top: 14px;}
#bot_about #bot_about_bot #about_img{
width:305px;
height: 115px;
margin:0 auto;
background-image: url("images/about.png")
}
#bot_about #bot_about_bot p{
font-size: 16px;
line-height: 18px;
margin-top:10px;
}
#bot_about #bot_about_bot a{
text-decoration: none;
color: red;
float:right;
}
.bot_contact_bot1{
float:left;
width: 56px;
height: 70px;
}
.bot_contact_bot2{
float: right;
width:209px;
height:50px;
}
.bot_contact_bot2 p{
font-size: 14px;
margin-top: 5px;
text-align: center;
color:#666;
}
.bot_contact_bot2 #man{
height:50px;
width:209px;
}
.bot_contact_bot2 #man ul{
height:50px;
width:209px;
}
.bot_contact_bot2 #man li{
float: left;
}
.bot_contact_bot2 #man li a{
display: block;
width: 35px;
height:35px;
margin-top:5px;
margin-left: 10px;
border: 1px solid #fff;
border-radius: 20px;
background-color: #eee;
}
.bot_contact_bot2 #man li #man1{
background-image: url("images/man.png");
background-position: -8px -3px;
}
.bot_contact_bot2 #man li #man2{
background-image: url("images/man.png");
background-position: -45px -3px;
}
.bot_contact_bot2 #man li #man3{
background-image: url("images/man.png");
background-position: -82px -3px;
}
.bot_contact_bot2 #man li #man4{
background-image: url("images/man.png");
background-position: -119px -3px;
}
#footer{
width:1349px;
height: 200px;
margin:0 auto;
margin-top:20px;
}
#footer #footer_top{
height: 170px;
background-color: #444;
}
#footer #footer_top #footer_box{
width: 1002px;
height:170px;
margin:0 auto;
background-color: #444;
}
#footer #footer_top #footer_box #footer_box_l{
width:610px;
height:170px;
float:left;
}
#footer #footer_top #footer_box #footer_box_l li{
float: left;
width: 150px;
border-right:1px solid #fff;
text-align: center;
}
#footer #footer_top #footer_box #footer_box_l .no{
border-right:none;
}
#footer #footer_top #footer_box #footer_box_l .yes{
border-left: 1px solid #fff;
}
#footer #footer_top #footer_box #footer_box_l li a{
display: block;
}
#footer #footer_top #footer_box #footer_box_l li h3{
font-size: 18px;
font-weight: bolder;
line-height: 40px;
margin-top: 20px;
color: #fff;
}
#footer #footer_top #footer_box li p{
color:#ccc;
}
#footer #footer_top #footer_box #footer_box_r{
width:150px;
height:170px;
float:left;
}
#footer #footer_top #footer_box #footer_box_r p{
text-align: center;
line-height: 120px;
font-size: 18px;
color: #ccc;
}
#footer #footer_bot{
height: 30px;
background-color: #000;
}
|
|