第一次寫部落格，今天剛做了乙個選單 ，發現border屬性的妙用， 效果如圖
主要用到的幾個屬性 border-color border-width border-style，
border-color ：設定邊框顏色 一共四個值 分別對應 上 右 下 左
border-width: 設定邊框的寬度 例如border-width: 5px 表示上 右 下 左的邊框值都為5px， border-width: 5px 4px則表示上下邊框值5px 左右邊框值位4px，border-width:5px 4px 6px 表示上邊框位5px 左右邊框位4px 下邊框為6px
border-color: transparent #2b7dbc transparent transparent;
border-width: 14px 10px;
border-style: solid;
通過設定顏色透明即可得出三角形狀
關於border屬性的小技巧 製作三角形
標籤的border屬性包含了4根邊框，而每根邊框的交界處是斜45度，不是水平垂直相交，如下圖 利用這種特性，可以把div標籤的高寬設為0，border設為大於0的畫素，這樣border就變為了乙個色塊，通過 border color 顏色 transparent來控制四個方向上的顏色或者是不是顯示，...
css 純 css 製作帶三角（border篇）
以前寫過一篇純css製作帶三角的邊框 那篇文章是用html特殊字元來製作三角的，今天介紹下，如何用 border 來製作三角。html 如下 div class arrow up div div class arrow down div div class arrow left div div cl...
border屬性實現箭頭和三角形
1 向上的箭頭 arrow 原理 畫出正方形的任意相鄰的兩條邊線，然後旋轉一定的角度 得到需要的任意方向的箭頭。deg 角度單位 rotate 旋轉角度 箭頭的大小由正方形的寬高去控制 箭頭的粗細由border width去控制 箭頭的顏色由border color去控制 2 直角三角形 三角形原理...