課程
/前端開發(fā)
/CSS3
/css3實現(xiàn)網(wǎng)頁平滑過渡效果
三角形不顯示
2015-07-22
源自:css3實現(xiàn)網(wǎng)頁平滑過渡效果 1-6
正在回答
.st-container input:checked+a{
background: #821134;
}
.st-container input:checked + a:after{
content:"";
width:0;
height:0;
overflow: hidden;
border:20px solid transparent;
border-bottom-color:#821134;
position:absolute;
bottom:100%;
left:50%;
margin-left: -20px;
必須要確保input和checked以及a:after之間的距離如上代碼!主要就是input和checked之間不能有空隙,看看是不是這里的問題
慕姐6345570 提問者
為什么是bottom:100%?
已經(jīng)看過了,是bottom:100%;這個地方我寫的是top:100px;的緣故,非常感謝!?。?/p>
舉報
CSS3 打造頁面之間的平滑過渡效果,帶來神奇的體驗
5 回答三角形寫完不顯示
2 回答三角形啊 顯示方形了
2 回答三角形溢出問題
3 回答三角形,的生成原理不懂?
1 回答三角形放中間的時候可以用em來拖動三角形至中線嗎
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網(wǎng)安備11010802030151號
購課補貼聯(lián)系客服咨詢優(yōu)惠詳情
慕課網(wǎng)APP您的移動學(xué)習伙伴
掃描二維碼關(guān)注慕課網(wǎng)微信公眾號
2015-08-21
.st-container input:checked+a{
background: #821134;
}
.st-container input:checked + a:after{
content:"";
width:0;
height:0;
overflow: hidden;
border:20px solid transparent;
border-bottom-color:#821134;
position:absolute;
bottom:100%;
left:50%;
margin-left: -20px;
}
必須要確保input和checked以及a:after之間的距離如上代碼!主要就是input和checked之間不能有空隙,看看是不是這里的問題
2015-11-19
為什么是bottom:100%?
2015-10-15
已經(jīng)看過了,是bottom:100%;這個地方我寫的是top:100px;的緣故,非常感謝!?。?/p>