第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時綁定郵箱和手機立即綁定

index-menu容器沒有被撐開,導致menu-tips直接頂?shù)絝ooter下面去了,顯示index-menu為0?

/*菜單menu部分*/

.index-menu{

position:relative;

border-top:4px solid #f34949;?

}


.index-menu .menu-tips{

position:absolute;

left:50%;

top:0px;

margin-left:-78px;

width:156px;

height:75px;

text-align:center;

line-height:65px;

color:#fff;

background:#f34949;

}

/*菜單提示標簽*/

.index-menu .menu-tips:after{

position:absolute;

content:"";

left:0;

buttom:0;

width:0;

height:0;

border-left:78px solid transparent;

border-right:78px solid transparent;

border-bottom:10px solid #fff;

}

http://img1.sycdn.imooc.com//577cbf4500019df813430599.jpg


正在回答

5 回答

還是要把.index-menu .menu-tips {}位置的position:absolute;改成position:relative;才能被撐開,你發(fā)下你的public-container樣式,就這個了,其他的沒什么不同

.index-menu{

position:relative;

border-top:4px solid #f34949;?

}


.index-menu .menu-tips{

position:relative;

left:50%;

top:0px;

margin-left:-78px;

width:156px;

height:75px;

text-align:center;

line-height:65px;

color:#fff;

background:#f34949;

}

/*菜單提示標簽

.index-menu .menu-tips:after{

position:absolute;

content:"";

left:0;

buttom:0;

width:0;

height:0;

border-left:78px solid transparent;

border-right:78px solid transparent;

border-bottom:10px solid #fff;

}


.public-container{

position:relative;

margin:0 auto;

width:1100px;

}

1 回復 有任何疑惑可以回復我~
#1

慕粉3523303 提問者

看錯,找出問題了,倒三角不能直接顯示那個是因為把bottom:0;打錯成buttom了,但是關于index-menu容器沒有被撐開,導致menu-tips直接頂?shù)絝ooter下面去了這個還是需要把position:absolute;改成position:relative;才可以被撐開
2016-07-15 回復 有任何疑惑可以回復我~
#2

慕粉3523303 提問者

直接復制你的代碼試的,發(fā)現(xiàn)了倒三角的問題,可是原先的問題還是沒法解決
2016-07-15 回復 有任何疑惑可以回復我~

代碼是這樣的,你看看你會不會哪里寫錯或者拼寫錯了

<!--------------------------html-------------------------------->

<div class="index-menu">

? ?<div class="menu-tips">The Menu</div>

? ?<div class="public-container menu-list">

? ?</div>

</div>


/*菜單css部分*/

.index-menu {

? ? position:relative;

? ? border-top:4px soid #f34949;

}

.index-menu .menu-tips {

position:absolute;

left:50%;

top:0;

margin-left:-78px;

width:156px;

height:75px;

text-align:center;

line-height:65px;

color:#fff;

background:#f34949;

}

.index-menu .menu-tips:after {

position:absolute;

content:'';

left:0;

bottom:0;

width:0;

height:0;

border-left:78px solid transparent;

? ? border-right:78px solid transparent;

border-bottom:10px solid #fff;

}


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

慕粉3523303 提問者

找出問題了,倒三角不能直接顯示那個是因為把bottom:0;打錯成buttom了,但是關于index-menu容器沒有被撐開,導致menu-tips直接頂?shù)絝ooter下面去了這個還是需要把position:absolute;改成position:relative;才可以被撐開,直接復制你的代碼試的,你發(fā)下你的public-container樣式看下,是不是哪里不一樣了
2016-07-15 回復 有任何疑惑可以回復我~

.index-menu .menu-tips{

position:relative;

left:50%;

top:0px;

margin-left:-78px;

width:156px;

height:75px;

text-align:center;

line-height:65px;

color:#fff;

background:#f34949;

}

/*菜單提示標簽*/

.index-menu .menu-tips:after{

position:absolute;

content:"";

left:0;

buttom:0;

width:0;

height:0;

margin-top:65px;

border-left:78px solid transparent;

border-right:78px solid transparent;

border-bottom:10px solid #fff;

}

我自己把.index-menu .menu-tips的position屬性改為relative后就可以撐開了,使用absolute就不行,倒三角那家了margin-top:65px;屬性也可以了,就是不知道老師的為什么可以定位到了

1 回復 有任何疑惑可以回復我~
#1

blazingskunk

是的,我也遇見這樣的問題,而且,在前面BANNER哪里,我遇見一個問題,圖片始終在左側,無法居中,后來增加了PUBLIC-CONTAINER,才行。
2016-07-11 回復 有任何疑惑可以回復我~
#2

徐司白3545646

我的按照老師那樣做也可以呀,你是不是.index-menu沒加relative?。?/div>
2016-07-14 回復 有任何疑惑可以回復我~

http://img1.sycdn.imooc.com//577da62000018d6313520700.jpghttp://img1.sycdn.imooc.com//577da738000130ab13480697.jpg

父元素index-menu盒模型的高度為0,子元素menu-tips的盒模型高度為75px,溢出在了外面,試了很多次父元素無法撐開,除非給父元素直接加個高度,不過就算那樣的話倒三角形的效果也出不來

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

貼的代碼看不出有什么錯,你在開發(fā)者工具里面看看盒模型,尺寸,位置的信息是否哪里有誤。

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

舉報

0/150
提交
取消

index-menu容器沒有被撐開,導致menu-tips直接頂?shù)絝ooter下面去了,顯示index-menu為0?

我要回答 關注問題
微信客服

購課補貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網(wǎng)微信公眾號