課程
/前端開發
/CSS3
/css3實現網頁平滑過渡效果
三角形不顯示
2015-07-22
源自：css3實現網頁平滑過渡效果 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%？
已經看過了，是bottom:100%;這個地方我寫的是top:100px;的緣故，非常感謝?。?！
舉報
CSS3 打造頁面之間的平滑過渡效果，帶來神奇的體驗
5 回答三角形寫完不顯示
2 回答三角形啊 顯示方形了
2 回答三角形溢出問題
3 回答三角形，的生成原理不懂？
1 回答三角形放中間的時候可以用em來拖動三角形至中線嗎
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網安備11010802030151號
購課補貼聯系客服咨詢優惠詳情
慕課網APP您的移動學習伙伴
掃描二維碼關注慕課網微信公眾號
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
已經看過了，是bottom:100%;這個地方我寫的是top:100px;的緣故，非常感謝?。?！