使用css來製作三角，在日常用得較多。恰好這幾天專案中有用到，之前只是從網上copy下來**直接用，但是今天在用的時候遇到一些問題，於是藉此機會把這個css繪製三角好好研究下吧。
我們分別寫乙個,,標籤，並給上下左右四個border賦值不同的顏色，看看是什麼樣子：
html：
.********在ie下，div構成的三角中的內容區比chrome要小。
如果，我們把四個方向border的任意一邊保留，其餘三個邊的顏色設定成透明，同時把設定height:0,width:0，這樣我們就能得到乙個三角形咯，我們先把所有邊的顏色都保留，看是什麼樣子的。
我們發現，div這種塊級元素，在chrome下面可以完美的表現出4個三角，但是ie下只能表現出上下的三角。其次，內聯元素表現出的樣式，在ie和chrome下面是一樣的。於是，這樣就可能會出現乙個問題。就是在寫三角的時候，我們寫上下三角的時候，在ie和chrome下面，塊級元素和內聯元素都能展示出三角。但是你如果按照這種**去寫左右方向的三角的話，在chrome下ok，但是ie下面就會顯示出體形來。這就會出現問題咯。這個問題也困擾了我，當時我也想，怎麼同樣的**，出來的三角就不一樣呢？原來方向不同，在ie下的表現也不一樣。好，現在，我們來讓梯形變成三角形。只需要加上一段**：font-size:0，就可以啦
修改css**如下：
好，現在我們再設定其中三個邊框的顏色為透明的！看看會不會有三角出現哦，就以右邊的三角為例吧。
修改css**如下：
.********ie6下面如此的醜陋，當然得解決掉，你可以使用如下的方法：
1. css hack
針對ie6的hack，給上，左，下的三個border設定為白色，但是這個情況只適用於背景色也為白色的情況
相應css**：
.********這個方法更好，設定要顯示一邊的三角border-style:solid，其他三邊為border-style:dashed，這樣利用虛線樣式的border可以形成天然無汙染的空白，多好！修改css**如下：
.********使用css製作三角，相容IE6，用到的標籤
使用css來製作三角，在日常用得較多。恰好這幾天專案中有用到，之前只是從網上copy下來 直接用，但是今天在用的時候遇到一些問題，於是藉此機會把這個css繪製三角好好研究下吧。我們分別寫乙個,標籤，並給上下左右四個border賦值不同的顏色，看看是什麼樣子 html css 在chrome下如圖 在...
純css製作三角 圓形按鈕，相容ie6
原文 以前一直用做小三角 圓形按鈕等，但有時候實在不太方便，例如換個顏色又要開啟ps弄，挺麻煩的。而且對於追求細節和極致的前端工程師來說，能不用就不用，於是參考了天貓 微博等 的做法，用純html和css實現，效果還是不錯的。以下是成果，相容主流瀏覽器，包括ie6。是 執行 編輯 檢視源 資源新增嚮...
CSS三角的寫法（相容IE6）
7.解決內聯元素的三角顯示問題 最終 擴充套件 三角的做法有好幾種 這裡主要介紹的純 寫的。寫的三角，不管大小是多少，是不失真的。執行比更快。如果專案中沒有引用字型圖示，寫是比較可靠的。原理就是使用css的盒模型中的border屬性 使用border屬性就可以實現乙個相容性很好的三角圖形效果，其底層...