CSS學習筆記 第一天
css是 cascading style sheet的縮寫 ，譯為層疊樣式表。
1、CSS引入方式
(1) 行間樣式
行間樣式方式是在标簽的開始部分以加屬性的方式加上css樣式，具體添加凡是如下：
<div style="
width:100px;
height:100px;
background-color:red;
">
</div>
(2)頁面級樣式
頁面級樣式是在html檔案中的head标簽中加入形如下面style标簽的代碼：
<style type="text/css">
div{
width:100px;
height:100px;
background-color:red;
}
</style>
(3)外部引用樣式
建立一個index.css檔案，在檔案中寫出樣式的值，例如一下為css檔案中的内容：
div{
width:100px;
height:100px;
border-radius:50%;
background-color:black;
}
然後在html檔案中引入，引入的方式為，在html檔案的head标簽内，添加link标簽，裡面的連結屬性href指向css檔案，例如：
<head>
<link rel="stylesheet" type="text/css" href="index.css" target="_blank" rel="external nofollow"
</head>
此時css的内容就會影響到html中。
2、html和css檔案的下載下傳是異步的同時的。
在下載下傳html執行到link css檔案時，會單獨開一個線程去下載下傳css檔案，原線程繼續下載下傳html。
3、選擇器
css如何選擇html的元素
(1)id選擇器
在html的标簽中添加屬性id
<div id="only">123
</div>
在css檔案中選擇此id
#only{
background-color:red;
}
這樣css中的樣式就可以通過id影響到html中屬性id的值為only的元素了。
id選擇器是一對一的。
(2)class選擇器
在html的标簽中添加屬性class
<div class="demo">123
</div>
在css檔案中選擇此class
.demo{
background-color:red;
}
class選擇器與元素的關系是多對多的，多個元素可以使用一個class，一個元素也可以有多個class class多個的寫法是class="aaa bbb"空格分隔是兩個class值。
(3)标簽選擇器
直接在css檔案中寫形如下面的形式的代碼：
div{
background-color:black;
}
這樣包含此css檔案的html檔案中的所有div标簽都被影響，嵌套關系不會影響标簽選擇器的效果。
(4)通配符選擇器
在css檔案中寫形如下面的代碼：
*{
background-color:green;
}
通配符的意思是選擇引入此css檔案的所有标簽都被此選擇器影響。
(5)屬性選擇器
css檔案中寫如下形式代碼：
[id或id="aaa"]{
background-color:red;
}
這種形式表示具備此種屬性的标簽被影響。
4、權重
權重的大小：
!important > 行間樣式 > id > class = 屬性選擇器 > 标簽選擇器 > 通配符
權重的值：用來計算權重
!important infinity
行間樣式 1000
id 100
class|屬性|僞類 10
标簽|僞元素 1
通配符 0
這裡的值是256進制
![CSS的僞元素和僞類的差別[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)