請教下我的背景圖片定位后效果出不來?
代碼:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<style type="text/css">
? ?*{margin: 0;padding: 0;}
ul{list-style-type: none;}
h3{font-size: 14px;
? font-weight: 400;
? }
li{display: block;
? height: 31px;
? line-height: 31px;
? overflow: hidden;
? border-bottom: 1px solid #dedede;
? margin: 3px 10px 0 0;
? }
.cat{width: 150px;
? ? background: #f8f8f8;
? ? border: 1px solid #ddd;
? ? }
i{background: url(img/sidebar.png);
?display:inline;
?width: 34px;
?height: 24px;
?float: left;}
?.cat-1 i{background-position: 0 0;}
?.cat-2 i{background-position: 0 -24px;}
?.cat-3 i{background-position: 0 -48px;}
?.cat-4 i{background-position: 0 -72px;}
?.cat-5 i{background-position: 0 -96px;}
?.cat-6 i{background-position: 0 -120px;}
?.cat-7 i{background-position: 0 -144px;}
?.cat-8 i{background-position: 0 -168px;}
</style>
</head>
<body>
<div class="cat">
<ul>
<li class="=cat-1">
<i></i>
<h3>服裝內衣</h3>
</li>
<li class="=cat-2">
<i></i>
<h3>鞋包配飾</h3>
</li>
<li class="=cat-3">
<i></i>
<h3>戶外運動</h3>
</li>
<li class="=cat-4">
<i></i>
<h3>珠寶手表</h3>
</li>
<li class="=cat-5">
<i></i>
<h3>手機數碼</h3>
</li>
<li class="=cat-6">
<i></i>
<h3>辦公電腦</h3>
</li>
<li class="=cat-7">
<i></i>
<h3>護膚彩妝</h3>
</li>
<li class="=cat-8">
<i></i>
<h3>母嬰用品</h3>
</li>
</ul>
</div>
</body>
</html>
2015-07-06
<li class="=cat-1">
只是這里多了個=
敲標識符的時候要注意點