banner圖片css設(shè)置問(wèn)題
banner圖片css設(shè)置問(wèn)題?
湖上湖
2019-05-29 11:07:17
4 回答
臨摹微笑
TA貢獻(xiàn)1982條經(jīng)驗(yàn) 獲得超2個(gè)贊
作為背景圖片顯示，然后寫CSS樣式，將背景圖片居中顯示就可以了。
樣式是這樣的;
#div{background:url('圖片路徑') center;}
這樣的話就可以滿足要求。
PIPIONE
TA貢獻(xiàn)1829條經(jīng)驗(yàn) 獲得超9個(gè)贊
你是要顯示通欄導(dǎo)航的效果把？CSS完全可以實(shí)現(xiàn)：
將banner外面加個(gè)DIV，調(diào)用樣式類nav，然后設(shè)置banner為1000像素寬，nav的設(shè)置自動(dòng)：
【CSS部分】
<style>
.nav{width:auto;height:30px;background:url(img/bg.jpg) center center no-repeat;}
.banner{width:1000px;height:30px;margin:0 auto;}
.banner ul{width:1000px;height:30px;}
.banner ul li{width:100px;height:30px;float:left;}
</style>
【網(wǎng)頁(yè)結(jié)構(gòu)】
<div class="nav">
<div class="banner">
<ul>
<li>導(dǎo)航<li>
<li>導(dǎo)航<li>
<li>導(dǎo)航<li>
<li>導(dǎo)航<li>
<li>導(dǎo)航<li>
<ul>
</div>
</div>
這樣就可以實(shí)現(xiàn)這個(gè)效果了
交互式愛(ài)情
TA貢獻(xiàn)1712條經(jīng)驗(yàn) 獲得超3個(gè)贊
其實(shí)應(yīng)該很好解決，之所以下面被遮住是因?yàn)?z index只算他的父級(jí) ，你的.nav沒(méi)有定義position:relitive;z-index:3; 那他里面的子元素再怎么寫也不可能比洗面的banner層級(jí)大。試試吧、
| 1 | .nav{position:relitive;z-index:3;} |
添加回答
舉報(bào)
0/150
提交
取消