css背景有哪些應用

1、替換插入圖，解決SEO問題。可以將HTML結構中，插入圖換成搜尋關鍵字。

使用css新增背景圖給<a>標籤或<h1>標籤。

<h1>
    <a href="#">淘寶網|購物|六一</a>
</h1>
<style>
.header h1 a {
display: block;
        width: 146px;
        height: 58px;
        background: url(images/logo.png) no‐repeat;
    }
</style>

然後將文字進行隱藏設定：

將字號設定為 0。IE8 及以上或高版本瀏覽器可以隱藏文字，但是 IE7 及以下有相容問題。

可以設定給 <a> 標籤一個 text-­indent 屬性，屬性值為負的很大的值，文字會走到盒子外部，直接再設定溢位隱藏屬性，將溢位文字隱藏。

2、padding區域背景圖，盒子中有背景圖和文字內容，文字會讓開背景圖區域進行載入，背景區域使用padding擠出位置。

.news li {
    padding‐left: 25px;
    background: url(images/s2.png) no‐repeat left center;
}

以上就是css背景的應用，希望對大家有所幫助。更多css學習指路：

本文轉載於掘金，如有侵犯聯絡作者修改。