課程
/前端開(kāi)發(fā)
/HTML/CSS
/導(dǎo)航條菜單的制作
既然設(shè)置了display:block,為什么margin:0 auto無(wú)效
2017-04-11
源自:導(dǎo)航條菜單的制作 1-3
正在回答
雖然你設(shè)置了a標(biāo)簽為塊狀元素,但是你沒(méi)有設(shè)置它的寬度,所以你用margin并不能使它居中,這樣就有幾種方法解決,第一,你可以設(shè)置a標(biāo)簽的寬帶;第二,你可以設(shè)置display:inline-block;text-align:center;這樣也可以實(shí)現(xiàn)居中效果;第三,你可以使用float:left;讓它浮動(dòng),然后設(shè)置父元素絕對(duì)定位position:absolute;left:50%;子元素left:-50%;這樣也可以實(shí)現(xiàn)居中效果,好像還有其他方法,這我一下子也想不起來(lái);
但是在這里你margin沒(méi)用就是因?yàn)槟銢](méi)有定寬,因?yàn)橹挥卸▽拤K狀元素才能使用margin:0 auto;實(shí)現(xiàn)居中效果
設(shè)置display:block,就是為了讓a標(biāo)簽顯示為塊狀元素,塊狀元素要先設(shè)置寬度,才能設(shè)置居中,你這樣明白嗎?
因?yàn)閷?lt;a>標(biāo)簽設(shè)置了塊,因此margin對(duì)它無(wú)效
qq_AG_11
舉報(bào)
水平、垂直、圓角導(dǎo)航條菜單,讓您的技術(shù)探索之路更高效
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號(hào)-11 京公網(wǎng)安備11010802030151號(hào)
購(gòu)課補(bǔ)貼聯(lián)系客服咨詢優(yōu)惠詳情
慕課網(wǎng)APP您的移動(dòng)學(xué)習(xí)伙伴
掃描二維碼關(guān)注慕課網(wǎng)微信公眾號(hào)
2017-04-18
雖然你設(shè)置了a標(biāo)簽為塊狀元素,但是你沒(méi)有設(shè)置它的寬度,所以你用margin并不能使它居中,這樣就有幾種方法解決,第一,你可以設(shè)置a標(biāo)簽的寬帶;第二,你可以設(shè)置display:inline-block;text-align:center;這樣也可以實(shí)現(xiàn)居中效果;第三,你可以使用float:left;讓它浮動(dòng),然后設(shè)置父元素絕對(duì)定位position:absolute;left:50%;子元素left:-50%;這樣也可以實(shí)現(xiàn)居中效果,好像還有其他方法,這我一下子也想不起來(lái);
但是在這里你margin沒(méi)用就是因?yàn)槟銢](méi)有定寬,因?yàn)橹挥卸▽拤K狀元素才能使用margin:0 auto;實(shí)現(xiàn)居中效果
2017-04-20
設(shè)置display:block,就是為了讓a標(biāo)簽顯示為塊狀元素,塊狀元素要先設(shè)置寬度,才能設(shè)置居中,你這樣明白嗎?
2017-04-11
因?yàn)閷?lt;a>標(biāo)簽設(shè)置了塊,因此margin對(duì)它無(wú)效