深入理解之border屬性（第一期）

border-width屬性不支援百分比值,不會因為裝置的尺寸變化而變大（類：outline,box-shadow,text-shadow）

border-width支援關鍵字，thin(1px 細),medium(3px 預設),thick(5px 粗)

border-style:solid;經常使用的實線。

.border

border- style:dotted;點線

注：ie中的點線是小圓形，chrome/firefox是小正方形的

border-style:double;雙線

注：雙線寬度永遠相等，中間間隔±1(相容性很好)

border-style:inset;內凹

注：價值不高

border-color的預設值是color。

類似預設的還有box-shadow,text-shadow。

background定位只能對於左上角

要使定位看上去是對於右邊的，可以這樣

三橫圖示的構建

2.三角圖示的構建

原理如下,所有當沒有內容時就會呈現三角形的形狀。

溜了溜了

後排提示之前在慕課看到了這個系列的教程，來自於張鑫旭老師，有興趣的朋友可以搜尋看看，本人在此做乙個學習記錄。

如果沒有描述清楚，可以去慕課檢視此課題（免費的哦，因為有錢我都看不起）

深入理解border屬性

定義 border thin,medium 預設值 thick 其他條件 border不支援百分比 border不會隨著裝置的放大縮小而改變 例項ie7 ie8實現圓角效果.parent parent childie7 ie8繪製列表 三 圖形divborder color 與圖形變色.parent...

CSS深入理解之border

總結自慕課網 個人理解 width屬性具有繼承性，假設父元素100px 子元素設定50 則為50px 而border width不具有繼承性，如果使用百分比，瀏覽器解析時應該向誰作為參考物件呢，所以只能用指定大小來確定。類似不支援百分比的有 outline,border shadow,text sh...

CSS深入理解之border篇

border的屬性 1.border width 不支援百分比，支援關鍵字，thin 1px medium 預設值，3px，預設值是3px的原因是只有當border是3px及以上時，border style才有效 果 thick 5px 2.border style 有不同值，下面分析分別為不同值時...