javascript - css 三角形缺口,
問題描述
如圖:
這個三角形缺口是透明的,請問咋個實現
大家請注意問題的關鍵,三角形能看見后面的背景
問題解答
回答1:我之前的做法是在導航欄上弄弄多一行小小幾px高的p的全是白色背景被選中的那個背景為一種透明“有缺口白色背景”圖片
回答2:p { width: 0; height: 0; border: 10px solid #fff; border-top-color: transparent;}回答3:
透明的三角形大概是做不出來的。
但你可以做兩個白色的梯形,留出中間那個三角形的位置就行了。
回答4:用border修飾實現三角形,想要透明用rgba
p{
width: 0;height: 0;border: 10px solid transparent;border-top-color: rgba(0,0,0,0.4)
}
回答5:頁面地址發出來,研究一下就知道了
回答6:同意小U醬的說法,我也只想到這一個辦法:
——————————————華麗的分割線———————————————用rotate做出來的效果:
p::before { content: ''; display: block; position: absolute; bottom: 0; left: -10px; width: 20px; /*自己調*/ border: 10px solid transparent; border-bottom-color: white;}p::after { content: ''; display: block; position: absolute; bottom: 0; right: -10px; width: 88px; /*自己調*/ border: 10px solid transparent; border-bottom-color: white;}
相關文章:
1. 求救一下,用新版的phpstudy,數據庫過段時間會消失是什么情況?2. vue.js - npm run dev報錯了,不知道是不是node.js或者npm installed的版本問題3. PHP類屬性聲明?4. javascript - vue引入微信jssdk 配置在哪個生命周期調取接口配置?5. objective-c - ios百度地圖定位問題6. lucene - java web 現在做搜索功能,用什么比較好呢7. 跟著課件一模一樣的操作使用tp6,出現了錯誤8. php laravel框架模型作用域9. PHPExcel表格導入數據庫怎么導入10. javascript - 這種效果是輪播的效果嗎??沒有思路,求解釋。謝謝大家
