我們很多時候都需要一些小圖示小的icon什麼，每次要img還得載入比較麻煩，用css就簡單方便多了
實現三角形有兩種思路，一種是border，一種是transform中的rotate
先認識盒模型
margin area用來分隔相鄰的元素，上下注意外邊距融合，是透明空白區域，可以outline、box-shadow等等效果
border
顧名思義，就是圍繞內邊距和內容外的邊框，可以控制border的相關樣式，我們最合適的三角形靠它來實現的
padding
內容或者content的內邊距，會受到背景、顏色或者的影響
content
內容區域，處於盒子模型的最裡層也是最重要的一層，用來顯示子元素和文字、影象這些內容的
在padding為0、width和height都為0時，padding area和content area都沒有大小了，
此時設定border，且top、right、bottom、left設定不同顏色之後就會類似下圖一樣
很明顯，在瀏覽器中border各個方向就是這麼劃分各自勢力範圍的
在實際專案中，當需要實心的三角形時我們可以只設定所需要方向的一邊所需要顏色，相鄰兩邊設定大小但設定背景色透明，不需要的一邊就不要設定了，比方說設定乙個向上的三角形
css 修改三角形大小 css實現三角形
最近的乙個專案頁面中，有很多三角形icon，在不考慮ie相容性下，使用了css實現三角形，記錄一下 1 實心三角形，利用transparent實現 1 設定線條寬50px，div 寬高0 width 0px height 0px border right 100px solid red border...
css三角形實現
我們的網頁因為 css 而呈現千變萬化的風格。這一看似簡單的樣式語言在使用中非常靈活，只要你發揮創意就能實現很多比人想象不到的效果。特別是隨著css3的廣泛使用，更多新奇的 css 作品湧現出來。up 1 2 3 4 5 6 7 up down 12 3 4 5 6 7 down left 12 3...
css實現三角形
css實現三角形是經常被問到的問題。所以下來就講一下css實現三角形的三種方法 transparent設定時透明的。順序為上右下左。實現類似於對話方塊的形式。底下的三角形的實現是兩個三角形。乙個是背景色，乙個是邊框色。背景色的比邊框色少1px，且利用背景色覆蓋在邊框色上面，就看到的只是邊框了。首先先...