導入外部css樣式表的方法

使用link標簽導入外部css樣式表

在樣式表中import(導入)外部樣式表

使用內部樣式表

內部樣式表只能作用于某一個網頁，定義方式為在head頭部添加style標簽，在style標簽中即可添加頁面樣式。

選擇器知識點

元素屬性選擇器

1）普通標簽選擇器

table:{background:red;}

2）含有某個屬性的標簽

div[id]{background:red;}表示含有id屬性的div元素

3）含有某個屬性并且屬性值為特定值的標簽

div[id=aaa]{background:red;}表示含有id屬性，并且id=aaa的div元素

4）含有某個屬性并且屬性值以特定值開頭的元素

div[id=^aaa]{background:red;}表示含有id屬性，并且id的值是以aaa開頭的div元素

5）含有某個屬性并且屬性值以特定值結尾的元素

div[id=$c]{background:red;}表示含有id屬性，并且id的值是以c結尾的div元素

ID選擇器

id選擇器，指定id為特定值的元素，比如#mydiv表示的是id為mydiv值的元素，id選擇器前面要添加符號#

Class選擇器

類選擇器是匹配class值的元素，選擇器前面必須添加符號.，比如.myclass表示的是所有class值為myclass的元素。

類選擇器可以結合元素選擇器使用，比如p.important{color:red;}必須同時符合兩個選擇器條件的元素才能生效。

包含選擇器、后代選擇器

后代選擇器可以選擇作為某元素后代的元素，例如：h1 em{color:red},這個規則會把作為h1元素后代的em元素的文本變為紅色，其他em文本不會被這條規則作用。

子選擇器

和后代選擇器類似，但是只會作用于元素的某直系后代。例如h1>strong{color:red;}是作用于h1元素中第一層級strong元素上，其他層級不受影響

相鄰兄弟選擇器

如果需要選擇緊接在另一個元素后的元素，而且兩者有相同的父元素，可以使用相鄰兄弟選擇器，例如h1+p{margin-top:50px;}選擇緊接在h1元素后出現的段落，h1與p元素擁有相同的父元素

選擇器分組

同時作用于多個元素的選擇器，例如h2,p{color:gray;}會同時作用于h2元素與p元素。

*為通配符選擇器，可與任何元素匹配

偽元素選擇器

1）:first-line{color:red;}文本首行設置特殊樣式

2）:first-letter{color:red;}文本首字母設置特殊樣式

:after、:before未選擇器

:before{}可與在元素內容的前面插入內容，內容可用content指定，