看到像上圖這樣的 tip 的小三角，你會怎麼辦？
純 css 做三角形的方法，目前我知道三種，分別是利用 border 屬性，「◆」字元，和 css3 transfrom 做 45 度旋轉實現的，css3的方法是在碼頭哥的部落格上學到的，很感謝你們的分享，前端有你們更精彩！
1.利用 border 屬性實現三角形
這個原理很簡單，我我們先看下面的圖，這是乙個邊框為 20px 的 div，看他的邊框，是個梯形，變化會從這裡開始。
css：
.********
.tc-border /*ie7-9*/.ie-transform-filter {-ms-filter: "progid:dximagetransform.microsoft.matrix(m11=0.7071067811865475,m12=-0.7071067811865477,m21=0.7071067811865477,m22=0.7071067811865475,sizingmethod='auto expand')";filter: progid:dximagetransform.microsoft.matrix(m11=0.7071067811865475,m12=-0.7071067811865477,m21=0.7071067811865477,m22=0.7071067811865475,sizingmethod='auto expand');
css繪製向左三角形 純css 實現三角形
每天學習乙個小技能 現在的 上 手機上我們經常見到一些下拉列表的下箭頭 其實方式很簡單 直接引入 或者去找字型檔案 隨著技術的發展 前端效能這一方面有很大的提公升 再不能用 或者盡量不適用的情況下 css 也可以繪製簡單的 下面就是三角形 首先這個思路的講解 就是用到了 border 邊框這個屬性 ...
純css繪製三角形
繪製三角形原理 html div css div效果圖 易迅三角實現 html 易迅三角 span div css divspan 效果圖 愛拍對話方塊實現 html class box class sj one span class sj two span div less charset utf...
純css實現三角形
1 將元素的寬高都設定為0。2 只設定border屬性。3 把任意三條邊隱藏掉 顏色設為 transparent 剩下的就是乙個三角形。lang zh cn charset utf 8 name viewport content width device width,initial scale 1....