目錄：
1、CSS注釋的書寫 怎麼寫？好處？
2、CSS引入方式 各種的優缺點
3、選擇器的寫法與選擇器的優先級
4、CSS命名規範
5、背景，行高
6、文本(text與font開頭)等所有屬性
① CSS注釋書寫規範：
1、單行注釋：
直接寫在屬性值的後面，如：
① .search{
border:1pxsolid#fff;/*定義搜尋輸入框邊框*/
background:url(../images/icon.gif)no-report#333;/*定義搜尋框的背景*/
}
② .wrap { /*height: 100px;*/ }
2、多行注釋：
分别在開始的地方及結束的地方注釋，如：
①/********Start 搜尋條開始********/
.search{
border:1pxsolid#fff;
background:url(../images/icon.gif)no-repeat#333;
}
/********End 搜尋條結束*********/
② <style type="text/css">
/*.tb {
width:300px;
font-size:12px;
background:#6887D9;
table-layout:fixed;
}*/
</style>
② CSS注釋書寫好處：
1. 利用注釋可以快速定位到複雜的代碼頁面中，可以高效的編寫樣式，使得代碼層次清楚，修改更加直覺。
2. css注解（css 注釋）可以幫助我們對自己寫的CSS檔案進行說明，如說明某段CSS代碼是什麼地方、功能、樣式等說明，以便我們以後維護具有一看即懂的友善性，同時在團隊開發網頁是時候合理适當的注解有利于團隊看懂css樣式是對應html哪裡的，以便順利快速開發網頁。
擴充：JavaScript的兩種注釋方法
行注釋
// 這是行注釋，注意‘//‘後面有空格
/* 這是一段注釋 */
塊注釋
/*
* 注釋以一行（*後面記得有空格）
* 注釋以二行（*後面記得有空格）
* 注釋以三行（*後面記得有空格）
*/
擴充：HTML結構的注釋方法
使用 <!--注釋内容--> 進行注釋
如：<body>
<!-- <div class="wrap"></div> -->
</body>
CSS引入方式 各種的優缺點
① 外部引入：使用最廣泛，一個css檔案可控制多個頁面，從整站來講，減少代碼數量，提高加載速度，便于維護
② 頭部引入：使用也比較多，加載速度快，一般用于通路量較大的網站或首頁，但是整站代碼較多，不利于維護
③ 标簽内寫：用得比較少，權重最高，代碼多，加載慢，不利于維護
④ @import: 跟link類似，如果使用@import的話，要将@import放到樣式代碼的最前面，否則它将會不起作用
link與@inport差別：
① @import url（）機制是不同于link的，link是在加載頁面前把css加載完畢，而@import url（）則是讀取完檔案後在加載，是以會出現一開始沒有css樣式，閃爍一下出現樣式後的頁面(網速慢的情況下)。
② @import 是css2裡面的，是以古老的ie5不支援。
③ 當使用javascript控制dom去改變樣式的時候，隻能使用link标簽，因為@import不是dom可以控制的
④ link除了能加載css外還能定義RSS，定義rel連接配接屬性，@import隻能加載css
擴充：JS三種引入方式
選擇器的寫法與選擇器的優先級
選擇器種類：
① 标簽名選擇器 ② ID名選擇器 ③ 類選擇器 ④ 後代選擇器
⑤ 群組選擇器 ⑥ 僞類選擇器 ⑦ 屬性選擇器 ⑧ 通配符 ⑨ 子代選擇器
選擇器優先級：
① CSS不同引入方式的優先級：标簽内嵌樣式 > 頭部書寫樣式 > 外部引用樣式 > 浏覽器預設樣式。
② CSS選擇器的優先級：id > class > tagname.
③ 多個選擇器混用時的優先級：例子.a .b c{}和.a c{},它們指向的目标都是c，但是前者的優先級高于後者。
注：當指向同一目标選擇器的優先級相同時，後面的優先級大于前面的優先級；當同一個标簽中定義有多個class名時，各個類選擇器之間的優先級與html中的class名排列無關，而是與css檔案中各個類選擇器的排列有關。
CSS命名規範
1、規則命名中，一律采用小寫加中劃線的方式，不允許使用大寫字母或_
2、命名避免使用中文拼音，應該采用更簡明有意義的英文但是進行組合
3、命名注意縮寫，但是不能盲目縮寫
4、不允許通過1 、2、3等序号進行命名
5、避免class與id重名
6、id用于辨別子產品或頁面的某一父容器區域，名稱必須唯一，不要随意建立id
7、class命名必須言簡意赅
8、除了重置浏覽器預設樣式外，禁止直接為html tag添加css樣式設定，例如：div { width:200px;height:100px;}
9、每一條規則應該確定選擇器唯一，禁止直接為全局 .nav/.header/.body等類設定屬性
擴充：JS命名規範
1、區分大小寫
2、首寫符必須是字母，下劃線（
_ ）或者美元符($)
3、除首字母外的字元，可以由字母，數字，下劃線，美元符号組成
4、不允許包含空格
背景，行高屬性
background背景屬性：
* background-color
* background-position
* background-size
* background-repeat
* background-origin
* background-clip
* background-attachment
* background-image
CSS3新增的屬性：
background的文法：[]
background-color：red | #RGB;
background-position:X軸坐标 Y軸坐标 | left| right | center | top..
background-size: 100px | 30% | cover | contain;
background-repeat: repeat | no-repeat | repeat-x | repeat-Y
background-origin：border | padding | content
background-clip：border-box | padding-box | content-box
background-attachment：fixed | scroll
background-image：url
簡寫的形式：background:color url() positon repeat；
備注：background-size的屬性值如果隻設定一個值，則第二個值會被設定為 "auto"。
cover：實作把背景圖像擴充至足夠大，以使背景圖像完全覆寫背景區域。
contain：把圖像圖像擴充至最大尺寸，以使其寬度和高度完全适應内容區域
line-height行高屬性：設定行間的距離（行高）。
文法： line-height : normal | <實數> | <長度> | <百分比> | inherit
行高與行距：
屬性
描述
設定文本顔色
設定文本方向。
設定行高。
設定字元間距。
對齊元素中的文本。
向文本添加修飾。
縮進元素中文本的首行。
text-shadow
設定文本陰影。CSS2 包含該屬性，但是 CSS2.1 沒有保留該屬性。
控制元素中的字母。
unicode-bidi
設定元素中空白的處理方式。
設定字間距。
簡寫屬性。作用是把所有針對字型的屬性設定在一個聲明中。
設定字型系列。
設定字型的尺寸。
當首選字型不可用時，對替換字型進行智能縮放。（CSS2.1 已删除該屬性。）
對字型進行水準拉伸。（CSS2.1 已删除該屬性。）
設定字型風格。
以小型大寫字型或者正常字型顯示文本。
設定字型的粗細。