                        課程
                    
                        /前端開發(fā)
                        
                            /HTML/CSS
                        
                        /CSS Sprite雪碧圖應(yīng)用

為什么我的背景圖片和文字重合了，我圖片設(shè)置了浮動的哇

為啥文字和圖片重合了，設(shè)置margin也沒用，好像感覺文字和圖片是一個整體的

酋長最帥

2015-12-13

源自：CSS Sprite雪碧圖應(yīng)用 3-3

關(guān)注問題我要回答

5695

操作

收起

3 回答

狂飆的蝸牛_1 回答被采納 +3 積分
2015-12-13

把文字放到 i 標簽的外面就好了， ? ? ? ?背景圖片本來就是做背景的，不在文字背后怎么能叫背景

0 回復有任何疑惑可以回復我~

收起回答

#1

酋長最帥提問者

- -!對頭哈，腦殼卡了。謝謝

2015-12-13 回復有任何疑惑可以回復我~

echo_kinchao
2015-12-13

圖片浮動文字會環(huán)繞

0 回復有任何疑惑可以回復我~

收起回答

qq_____暖_0
2015-12-13

發(fā)一下你的完整代碼吧。

以下是我的代碼。你可以參考一下。

<!DOCTYPE?html>
<html>
<head>
<meta?charset="UTF-8">
<title>Document</title>
</head>
<style?type="text/css">
*{padding:?0;margin:?0}
ul{list-style:?none;}
li{line-height:?31px;display:?block;height:?31px;overflow:?hidden;border-bottom:?1px?solid?#dedede}
li?h3{font-size:14px;font-weight:?400}

.main{
margin:?10px?10px;
width:?150px;
background:?#f8f8f8;
border:?1px?solid?#ddd;
}

.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;}
.cat-9?i{background-position:?-40px?0px;}


li?i{?background:?url(sidebar.png);display:?block;width:?30px;height:?24px;float:?left;margin:?3px?10px;}
</style>
<body>

<div>
<ul>
<li>
<i></i>
<h3>服裝內(nèi)衣</h3>
</li>
<li>
<i></i>
<h3>鞋包裝飾</h3>
</li>
<li>
<i></i>
<h3></h3>
</li>
<li>
<i></i>
<h3></h3>
</li>
<li>
<i></i>
<h3></h3>
</li>
<li>
<i></i>
<h3></h3>
</li>
<li>
<i></i>
<h3></h3>
</li>
<li>
<i></i>
<h3></h3>
</li>
<li>
<i></i>
<h3>其他分類</h3>
</li>
</ul>
</div>

</body>
</html>

0 回復有任何疑惑可以回復我~

收起回答