日期:2014-5-17 浏览次数:20106次

【求助】为什么在UL下的框左边会有边距?
HTML code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
</head> 
<style>
.shopzp{display:inline-block;
         width:950px;
         background:#2e180d;
        }
.shopzp li {
    display:inline;
    width:100px;
    float:left;
    line-height:30px
}
.shopzp a {
    position:relative;
    left:-40px;
    display:block;
    text-decoration:none;
    background:#cccccc;
    width:100px;
    
}
.shopzp a span {
    display:block;
    font-weight:bold;
    color:#000;
    text-align:center;
    font-family:"微软雅黑";
}
.shopzp a em {
    display:none;
}
.shopzp a:hover {
    background:#FF0000;
}
.shopzp a:hover span {
    color:#fff;


}</style>
<ul class="shopzp">
  <li><a href="#"><span>全部商品</span></a></li>
  <li><a href="#"><span>首页</span></a></li>
  <li><a href="#"><span>热卖宝贝</span></a></li>
  <li><a href="#"><span>新品抢购</span></a></li>
  <li><a href="#"><span>活动专区</span></a></li>
  <li style="position:relative;right:-40;float:right; font-size:14px"><a href="#"><span>服务指南</span></a></li>
  <li style="position:relative;right:-40;float:right; font-size:14px"><a href="#"><span>收藏店铺</span></a></li>
</ul>


------解决方案--------------------
默认情况下,body,ul 等标签有margin,padding值,需要重置一下默认值。