style.css

是一款很漂亮的 ecshop 模板 希望大家能够喜欢

/*
Template Name: Enkel-Blue
Template URI: http://www.mallcool.com/
Description: The Enkel series template for ECShop 2.5.1
Version: 1.0
Author: Aresway
Author URI: http://www.aresway.com/
Logo filename: logo.gif
*/
@charset "utf-8";

/*  ==================== 全局标签样式 ====================  */

body {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	color: #808080;
	background-color:#fff;
	margin:0px;
	word-break:break-all;
}
img {
border: 0;
}
form {
	margin: 0px;
	padding: 0px;
}
div, td, p {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	line-height: 150%;
	word-break:break-all;
}
input, select, textarea {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
}
a:link{
    color:#555;
    text-decoration: none;
}
a:visited {
    color: #666;
    text-decoration: none;
}
a:hover {
    color:#000;
	text-decoration: none;
}

/*  ==================== 特色主页布局 ====================  */
.shop{
background:#d3d6d6;
min-height:575px;
}
.shop-body{
background:#FFF;
width:945px;
min-height:575px;
margin:0 auto;
}
.shop-top{
width:900px;
height:40px;
margin:0 auto;
}
.shop-back{
margin:0 auto;
width:685px;
height:360px;
background:url(images/shop_back.gif) no-repeat;
}

.shop-show{
width:486px;
height:54px;
margin:0px auto;
padding:3px 50px 3px 49px;
background:url(images/shop_show.gif) no-repeat;
}
.shopitem{
margin:2px;
float:left;
}
.shop-logo{
width:200px;
height:80px;
margin:0 auto;
background:url(images/shop_logo.png) no-repeat;
*background:url(images/shop_logo.png) no-repeat!important;
*background:none;
*filter:!important;
*filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, src="themes/enkel_blue/images/shop_logo.png");
}
.girl{
width:96px;
height:140px;
position:relative;
background:url(images/girl.png) no-repeat;
*background:url(images/girl.png) no-repeat!important;
*background:none;
*filter:!important;
*filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, src="themes/enkel_blue/images/girl.png");
}
.shop-counter{
width:505px;
height:230px;
margin:-120px auto 0 auto;
}
.counter-top{
background:url(images/counter_top.png) no-repeat;
*background:url(images/counter_top.png) no-repeat!important;
*background:none;
*filter:!important;
*filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, src="themes/enkel_blue/images/counter_top.png");
height:23px;
}
.counter-body{
height:174px;
padding-top:8px;
background:#ddd;
}
.counter-bottom{
width:475px;
height:20px;
background:url(images/counter_bottom.gif) no-repeat;
margin:0 auto;
}
.flash-show{
border:#aaa solid 3px;
width:480px;
height:160px;
margin:0 auto;
}
.rug{
width:505px;
height:70px;
margin:0 auto;
}
.rug-left{
width:80px;
height:70px;
background:url(images/rug_left.gif) no-repeat;
float:left;
}
.rug-body{
width:345px;
height:70px;
background:url(images/rug_body.gif);
float:left;
}
.rug-right{
width:80px;
height:70px;
background:url(images/rug_right.gif) no-repeat;
float:right;
}
.side-left{
width:190px;
float:left;
margin:-580px auto auto 0;*margin:-288px auto auto 0!important;*margin:-288px auto auto 0;
height:585px;
background:url(images/side_left.png);*background:url(images/side_left.png)!important;*background:none;
*filter:!important;
*filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod='scale', src="themes/enkel_blue/images/side_left.png");
}
.side-right{
width:190px;
float:right;
margin:-580px auto auto 0;*margin:-288px auto auto 0!important;*margin:-288px auto auto 0;
padding:0;
height:585px;
background:url(images/side_right.png);*background:url(images/side_right.png)!important;*background:none;
*filter:!important;
*filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod='scale', src="themes/enkel_blue/images/side_right.png");
}
.side-show{
width:176px;*width:176px!important;*width:180px;
height:447px;
margin:89px 7px 7px 7px;*margin:89px 7px 7px 7px!important;*margin:89px 5px 7px 5px;
}
.showitem{
margin:3px; 
border:#aaa solid 1px; 
float:left;
}
.marginbottom20{
margin-bottom:20px;
}
.shop-search{
text-align:right;
vertical-align:middle;
width:550px;
height:30px;
margin:0 auto;
line-height:30px;
}
.shop-goods{
background:url(images/shopgoods_back.gif) no-repeat;
width:140px;
height:50px;
margin-top:45px;
margin-left:-100px;*margin-left:-105px!important;*margin-left:-105px;
padding:7px 5px 3px 5px;
position:absolute;
z-index:20;
display:none;
}
.side-goods{
background:url(images/shopgoods_back.gif) no-repeat;
width:140px;
height:50px;
margin-top:55px;
margin-left:-115px;
padding:7px 5px 3px 5px;
position:absolute;
z-index:20;
display:none;
}
.shadow-left{
width:190px;
height:30px;
background:url(images/shadow_left.gif) no-repeat;
float:left;
}
.shadow-right{
width:190px;
height:30px;
background:url(images/shadow_right.gif) no-repeat;
float:right;
}
/*  ==================== 全局布局样式 ====================  */
.cbody{
width:945px;
margin:0 auto;
}
.gleft{
float:left;
width:470px;
}
.gright{
float:right;
width:470px;
}
.ileft{
	width:240px;
	float:left; 

}
.iright{
	width:700px; 
	float:right; 
}
.kleft{
	width:700px;
	float:left; 

}
.kright{
	width:240px; 
	float:right; 
}

/*  ==================== 全局通用样式 ====================  */

.floatclear{
	clear:both;
}
.floatleft{
float:left;
}
.floatright{
float:right;
}
.margintop{
	margin-top:5px;
}

.aligncenter{
	text-align:center;
}
.title{
height:30px;
}
.title-left{
float:left; 
margin-left:33px;
margin-top:8px;
font-size:13px;
font-weight:bold;
color:#333;
}
.titles{
height:22px;
padding-left:33px;
padding-top:6px;
font-size:13px;
font-weight:bold;
color:#333;
background:url(images/title_icon.gif) no-repeat;
}
.t-icon{
background:url(images/title_icon.gif) no-repeat;
}
.t-group{
background:url(images/title_group.gif) no-repeat;
}
.t-auction{
background:url(images/title_auction.gif) no-repeat;
}
.listbox{
border:3px solid #ddd;
padding:5px;
height:;*height100%:!important;*height:100%;
}
.listgoods{
width:145px;
float: left; 
margin-left:5px;
display:inline;
}
.more{
	margin:8px;
	float:right;
}
.title-right{
    font-weight:normal;
    line-height:24px;
	margin-right:10px;
	float:right;
}
.content-div {
	  padding: 5px;
}
.promotion-price{
	color:#FF3300;
	font-size:12px;
	font-weight:bold;
	font-family:Arial;
}
.market-price {
	text-decoration: line-through;
}
.goods-price {
	color:#0099ff;
	font-size:12px;
	font-weight:bold;
	font-family:Arial;
}
.pop-div{
	background-color:#ffffff;
	border:#666 solid 2px;
	padding:5px;
	position:absolute;
	z-index:10;
	display:none;
	filter: alpha(opacity=90); 
	opacity:0.9;
	min-height:50px;
}

.liststyle {
	overflow: hidden;
    padding: 0 0 0 5px ;
	margin:0;
}
.liststyle li {
	background: url(images/alist.gif) no-repeat;
	border-bottom:#eee dashed 1px;
	padding-left: 30px;
}

.watermark_small {
  display: block;
  text-indent: -9999px;
  width: 27px;    height: 13px;
  margin-right: 3px;
  margin-top:5px;
  float: left;
}
.watermark_promote_small {
  background: url(images/watermark_promote_small.gif) no-repeat;
}
.watermark_new_small {
  background: url(images/watermark_new_small.gif) no-repeat;
}
.watermark_best_small {
  background: url(images/watermark_best_small.gif) no-repeat;
}
.watermark_hot_small {
  background: url(images/watermark_hot_small.gif) no-repeat;
}


/*  ==================== 模块样式 ====================  */
.nav {
    padding-left:50px;
    background:url(images/menu.gif) repeat-x;
	overflow:hidden;
}
.nav_left{
width:120px;
height:40px;
background:url(images/menu_left.gif) no-repeat;

}
.nav_right{
width:120px;
height:40px;
background:url(images/menu_right.gif) no-repeat;

}
.navitem {
    height:40px;
	float: left;
	padding:0 5px;
	margin:0 5px;
	font-weight:bold;
	font-size:13px;
	line-height:32px;
/*	margin-top:5px;*/
}
.navitemvv{
height:40px;
float:left;
display:none;
/*cursor:pointer;*/
margin:0 3px;
}
.navitemv{
height:40px;
font-weight:bold;
font-size:13px;
background:url(images/nav.gif);
}
.navitemv-left{
width:24px;
height:40px;
background:url(images/nav_left.gif);
}
.navitemv-right{
width:24px;
height:40px;
background:url(images/nav_right.gif);
}
.navitemv a:visited, .navitemv a:link, navitemv a:hover{
	color:#fff;
}
.navitem a:visited, .navitem a:link, .navitem a:hover{
	color:#555;
}
.navbtnl{
width:100px;
height:40px;
margin:5px 20px 0 70px;
cursor:pointer;
}
.navbtnr{
width:100px;
height:40px;
margin:5px 70px 0 20px;
cursor:pointer;
}
.btn-allcat{
width:100px;
height:40px;
margin:5px -30px 0 50px;
cursor:pointer;
}
.btn-qmenu{
width:100px;
height:40px;
margin:5px 50px 0 -30px;
cursor:pointer;
}
.allcat{
width:945px;
position:absolute;
display:none;
z-index:20;
margin-left:-70px;
margin-top:11px;
}
.quickmenu{
width:160px;
position:absolute;
display:none;
z-index:20;
margin-left:-30px;
margin-top:11px;
}
.quickmenu-item{
width:90px;
height:20px;
padding-left:30px;
background:url(images/alist.gif) no-repeat 0 0px;
border-bottom:#eee dashed 1px;
}
.mcbox{
width:945px;
height:40px;
background:url(images/box_back.gif) repeat-x;
}
.mcbox-left{
width:45px;
height:40px;
background:url(images/box_member.gif) no-repeat;
float:left;
}
.mcbox-right{
width:45px;
height:40px;
background:url(images/box_cart.gif) no-repeat;
float:right;
}
.mcbox-center{
width:10px;
height:40px;
background:url(images/box_middle.gif) no-repeat;
float:right;
}
.goods-table{
border:#f7f7f7 solid 1px;
margin-bottom:5px;
}
.goods-item{
background:url(images/arrow03.gif) no-repeat 5px 8px;
padding-left:20px;
width:185px;
height:24px;
}
.price-back{
background:#f7f7f7;
border:#eee solid 1px;
padding:10px;
}
.member{
float:left;
}
.cart{
min-width:10px;
float:right;
margin-left:10px;
}
.probox{
width:939px;
height:150px;
border:#eee solid 3px;
}
.probtn{
width:49px;
height:150px;
border-left:#eee solid 1px;
float:left;
cursor:pointer;
}
.proleft{
width:299px;*width:299px!important;*width:289px;
height:130px;
float:left;
display:none;
background:url(images/proback.gif) no-repeat;
padding:10px 10px 10px 30px;
overflow:auto;
}
.article-list{
height:20px;
border-bottom:#eee dashed 1px;
padding-left:20px;
background:url(images/alist.gif) no-repeat;
}
.branditem{
margin:3px 5px;
}
.topitem{ 
width:145px;*width:145px!important;*width:140px;
height:26px;*height:26px!important;*height:22px;
line-height:26px;
float:left;
overflow:hidden;
}
.phone{
background:url(images/phone.gif) no-repeat;
height:40px;
padding:0 20px 0 120px;
width:149px;
}
.phoneno{
color:#FF6600;
font-size:16px;
font-weight:bold;
letter-spacing:3px;
line-height:16px;
font-family:Arial;
}
.bmenu{
width:800px;
height:24px;
margin-left:72px;
z-index:50px;
position:absolute;
}
.bmenu-left{
width:10px;
height:24px;
background:url(images/bmenu_left.gif) no-repeat;
float:left;
}
.bmenu-right{
width:10px;
height:24px;
background:url(images/bmenu_right.gif) no-repeat;
float:right;
}
.bmenu-center{
width:780px;
height:24px;
line-height:24px;
background:url(images/bmenu_back.gif) repeat-x;
text-align:center;
float:left;
}
.copyright{
margin-top:16px;
z-index:20px;
position:absolute;
}
.copy-box{
width:925px;
border:#eee solid 3px;
padding:22px 7px 12px 7px;
}
.ur-here{
height:20px;
line-height:20px;
border-bottom:#f7f7f7 5px solid;
background:url(images/arrow02.gif) no-repeat;
padding-left:20px;
}
.catitem{
background:#f7f7f7;
padding:3px;
}
.subcatitem{
float:left;
width:100px;
padding:2px;
margin:2px;
border:#f0f0f0 solid 2px;
text-align:center;
overflow:hidden;
}
.topback{
background:url(images/top_back.gif) center top no-repeat;
}
.search-back{
background:url(images/search_back.gif) no-repeat;
width:400px;
height:36px;
margin:2px auto;
}
.flow{
background:url(images/flow.gif) no-repeat;
width:945px;
height:80px;
}
/*  ==================== 对比商品 ====================  */
#compareBox {
width: 130px;
background: #fff;
padding: 10px 3px 5px;
border: 1px solid #999;
position: absolute;
right:1px;   top:200px;
opacity: 0.8;    filter: progid:DXImageTransform.Microsoft.BasicImage(opacity=0.8); 
}
#compareBox input {
color: #FFF;
background: #000;
width: 120px;
padding-top: 3px;
margin-bottom: 5px;
border: 1px solid #000;
}
#compareList {
width: 120px;
margin: 0px;    padding: 0px;
}
#compareList li {
color: #333;
text-align:left;
width: 110px;
height: 18px;
background: #F1F1F1;
margin: 3px;
padding: 3px;
border: 1px solid #999;
overflow:hidden;
}
#compareList li img {
cursor: pointer;
margin-right:5px;
}