一接谨、簡單選擇器
至于什么意思按我自己的理解（可能不準(zhǔn)確）就是按不同選擇器HTML按css不同的樣式布局
- 通用選擇器
*{
background-color: white;
}
用*號來定義會(huì)在引用的HTML的所有標(biāo)簽里都應(yīng)用一遍
- 元素選擇器
body{
background-color: lightgrey;
}
用HTML里的標(biāo)簽來定義同城是HTML的標(biāo)簽都可以指定一類標(biāo)簽來應(yīng)用
- 類選擇器
.table_css{
background-color: #ffffff;
border: 1px solid #cccccc;
border-radius: 2px;
}
用.xxx來定義其中xxx不能以數(shù)字開頭不能有中文
- ID選擇器
#table_css{
background-color: #ffffff;
border: 1px solid #cccccc;
border-radius: 2px;
}
用#xxx來定義其中xxx不能以數(shù)字開頭不能有中文
二低缩、css樣式的引用
既然定義了這么多選擇器怎么使用呢尽狠？
- 內(nèi)聯(lián)
<div style="background-color: white"></div>
把樣式直接寫在標(biāo)簽的里面（盡量少用）
- 定義在HTML<head>中
<style>
div{
width: 200px;
height: 200px;
border: 2px solid black;
}
</style>
- 單獨(dú)定義css文件再引用到HTML中
<link rel="stylesheet" href="selectedcss.css">
三折汞、css樣式的使用
- 內(nèi)聯(lián)的方式就不多解釋了
<div style="background-color: white"></div>
在哪個(gè)標(biāo)簽里寫的哪個(gè)標(biāo)簽就會(huì)應(yīng)用寫的樣式
- 通用選擇器定義的當(dāng)你引用css樣式時(shí)所以標(biāo)簽都會(huì)應(yīng)用
- 元素選擇器定義的
body{
background-color: lightgrey;
}
類似于這樣定義的只是所有body會(huì)應(yīng)用
- 類選擇器
.table_css{
background-color: #ffffff;
border: 1px solid #cccccc;
border-radius: 2px;
}
<table class="table_css">
定義好的類選擇器在需要應(yīng)用的標(biāo)簽位置用class來應(yīng)用
- ID選擇器
< table id="table_css">
同類選擇器差不多也是在需要應(yīng)用的標(biāo)簽位置用id來應(yīng)用
四芬失、偽類選擇器
- hover 鼠標(biāo)懸停
- link 未訪問過鏈接
- visited 訪問過鏈接
- active 鼠標(biāo)點(diǎn)擊的時(shí)候
- focus 獲取焦點(diǎn)時(shí)候的樣式
使用方式是在對應(yīng)的選擇器后加:hover
.table_css:hover{
background-color: #ffffff;
border: 1px solid #cccccc;
border-radius: 2px;
}
五恕齐、選擇器權(quán)值
- 元素選擇器 1
- 類選擇器 10
- 偽類選擇器 10
- ID選擇器 100
- 內(nèi)聯(lián)選擇器 1000
