最近在看CSS，隨手整理一下筆記，希望給剛看的朋友帶來點幫助，有不對的地方歡迎留言，看到一定回覆！
width 寬
height 高
backgroud 背景色
背景色
background-color: 顏色值 (英文單詞 十六進制 rgb)
背景圖
background-image:url("圖片路徑“)
背景圖平鋪
background-repeat: no-repeat repeat-x repeat-y
背景圖定位
background-position: 第一個值(X軸的位置) 第二個值(Y軸的位置)
第一個值：left center right 30px;
第二個值：top center bottom 100px;
複合寫法(注意順序)
background：color image position repeat;
例子：
background-color : #db7791;
background-color : rgb(219, 119, 145);
background-color : blue;
background-image : url("img/test.jpg");
background-repeat : no-repeat;
background-position : right bottom;
background : red url("img/test.jpg") 30px 100px no-repeat;
border 邊框
複合寫法
border ： border-width border-style border-color;
border-width 邊框寬度
border-style 邊框樣式 solid 實線 dashed 虛線 dotted 點線 (點線IE6不認)
border-color 邊框顏色 英文單詞 十六進制 rgb
border-radius 圓角
transparent 透明
例子：
border-top : 100px solid #ccc;
border-right : 100px solid transparent;
border-bottom : 100px solid #ccc;
border-left : 100px solid #ccc;
border-radius : 50%;
border : 10px solid yellow;
padding 內邊距 內填充
padding-top: 上內邊距
padding-right: 右內邊距
padding-bottom: 下內邊距
padding-left: 左內邊距
padding的複合寫法：
padding: 10px; 一個值代表上右下左都是10px
padding: 10px 20px; 兩個值 第一個代表上下 第二個代表左右
padding: 10px 20px 40px; 三個值 第一個代表上 第二個代表左右 第三個代表下
padding: 10px 20px 40px 80px; 四個值 第一個代表上 第二個代表右 第三個代表下 第四個代表左
margin 外邊距
margin-top: 上外邊距
margin-right: 右外邊距
margin-bottom: 下外邊距
margin-left: 左外邊距
margin的複合寫法：
margin: 10px; 一個值代表上右下左都是10px
margin: 10px 20px; 兩個值 第一個代表上下 第二個代表左右
margin: 10px 20px 40px; 三個值 第一個代表上 第二個代表左右 第三個代表下
margin: 10px 20px 40px 80px; 四個值 第一個代表上 第二個代表右 第三個代表下 第四個代表左
1、子級的margin-top會在特定的情況下穿透父級。
規避方法：
a、給父級加邊框
b、給父級加overflow:hidden;
2、兄弟關係的margin-top 和margin-bottom會疊壓。
background 背景色
padding的複合寫法：
background: color image position repeat;
注意：div實際佔地面積 = div的長度 + border + padding