CSS的背景圖設置方式非常靈活,除了可以使用基本的background-image屬性來添加圖片,還可以使用z-index屬性來控制背景圖片的疊放順序。
z-index屬性是用來設置一個元素的層級順序,數值越大的元素在屏幕上顯示的位置就越靠前,而數值相同的元素按照代碼中的先后順序進行疊放。在設置背景圖時,使用z-index可以將背景圖置于所有內容之下,使得內容不會遮擋背景圖。
.example { background-image: url('bg.jpg'); z-index: -1; }
上述代碼中,.example是一個class選擇器,用于選中一個元素,然后使用background-image屬性將圖片添加為背景圖,同時使用z-index屬性將其設置為-1。這樣設置后,該元素的背景圖片就會顯示在所有內容的下方。
在使用z-index屬性時需要注意,只有設置了position屬性值為relative或absolute的元素才能使用z-index屬性。另外,z-index屬性不會影響元素自身的大小和位置,只會影響元素在屏幕上的疊放順序。
上一篇css背景圖設置不顯示
下一篇json怎么用手機打開