1、 css七大選擇器,偽類選擇器hover的使用?
定義和用法:hover 選擇器用于選擇鼠標(biāo)指針浮動(dòng)在上面的元素。提示::hover 選擇器可用于所有元素,不只是鏈接。提示::link 選擇器設(shè)置指向未被訪問(wèn)頁(yè)面的鏈接的樣式,:visited 選擇器用于設(shè)置指向已被訪問(wèn)的頁(yè)面的鏈接,:active 選擇器用于活動(dòng)鏈接。注釋:在 CSS 定義中,:hover 必須位于 :link 和 :visited 之后(如果存在的話),這樣樣式才能生效。代碼效果測(cè)試:
請(qǐng)把鼠標(biāo)指針移動(dòng)到這些鏈接上。
這個(gè)鏈接改變顏色。
這個(gè)鏈接改變字體大小。
這個(gè)鏈接改變背景色。
這個(gè)鏈接改變字體。
這個(gè)鏈接會(huì)出現(xiàn)下劃線。
2、 css派生器區(qū)別是什么?
派生選擇器 可以使一個(gè)元素里的子元素定義樣式 例如: li a { font-size:14px} 就是給li下的子元素a定義一個(gè)14px號(hào)像素的字體樣式 類別選擇器 在html中引入css樣式通常由,類別選擇器 在CSS中用一個(gè)“.”點(diǎn)開頭表示 如:.box {width:960px; margin:0 auto; padding:0px; overflow:hidden} 在html頁(yè)面中,用class="類別名"的方法調(diào)用: 這里是內(nèi)容 類別選擇器方法比較簡(jiǎn)單靈活,可以隨時(shí)根據(jù)頁(yè)面的需求新建和刪除 還有,id選擇器 在CSS中用“#”號(hào)開頭表示 如:#box {width:960px; margin:0 auto; padding:0px; overflow:hidden} 在html頁(yè)面中,用id="類別名"的方法調(diào)用: 這里是內(nèi)容 id選擇器和類別選擇器其實(shí)是一樣的 通常id選擇器僅是用來(lái)表示不重復(fù)的樣式 相對(duì)的來(lái)說(shuō),類別選擇器靈活一些,而id選擇器僅表示重要的樣式字段
3、 css派生選擇器有幾種?
基本選擇器
1.標(biāo)簽選擇器:直接用元素的標(biāo)簽來(lái)進(jìn)行選擇
span { // 直接選擇span標(biāo)簽
size:16px;
}
1
2
3
1
2
3
2.ID選擇器:通過(guò)設(shè)置id名字,進(jìn)行精確的選擇,用#來(lái)定義
# div1 { //通過(guò)id名字來(lái)進(jìn)行選擇
color:red;
}
<div id="div1">1</div>
1
2
3
4
1
2
3
4
3.類選擇器:通過(guò)類名來(lái)進(jìn)行選擇,選擇范圍比id選擇器大,用’.'來(lái)定義
.div1 { //所有類名為div1的都被選擇了
color:red;
}
<div id="div1">1</div>
<div id="div1">1</div>
<div id="div1">1</div>
1
2
3
4
5
6
1
2
3
4
5
6
4.通配符選擇器:范圍更大,作用于所有標(biāo)簽,用*來(lái)定義
不建議使用,對(duì)頁(yè)面加載負(fù)擔(dān)大
高級(jí)選擇器
1.后代選擇器:定義用空格隔開
div span { //選擇的是div標(biāo)簽下的span標(biāo)簽,當(dāng)然后代顧名思義可以不止隔一代,可以隔多代進(jìn)行選擇
color:red;
}
<div><span>1</span></div>
1
2
3
4
1
2
3
4
2.交集選擇器:與后代選擇器定義的不同是,沒(méi)有空格隔開,兩個(gè)元素緊挨著
span#a1 { //選擇的是兩個(gè)條件1.既是span標(biāo)簽的 2.id名是a1的元素,兩個(gè)條件缺一不可
color:red;
}
<span id=“a1”>1</span>
<span >1</span>
1
2
3
4
5
1
2
3
4
5
3.并集選擇器:定義用逗號(hào)隔開
span,#a1 { //選擇的是1.是span標(biāo)簽的 2.id名是a1的元素,兩個(gè)條件滿足一個(gè)即可
color:red;
}
<span id=“a1”>1</span>
<span >1</span>
1
2
3
4
5
1
2
3
4
5
4.偽類選擇器:
1.靜態(tài)偽類:點(diǎn)擊連接之前(link),點(diǎn)擊連接之后(visited)這樣的
2.動(dòng)態(tài)偽類:鼠標(biāo)移入(hover),點(diǎn)擊之后(focus)
4、 和css中的選擇器有什么區(qū)別?
這個(gè)是有區(qū)別的。
1、首先說(shuō)兩者是屬于不同的兩門語(yǔ)言,jquery是屬于js的一個(gè)框架,則其選擇器是js里面的選擇器,css是另一門不同于js的語(yǔ)言,其選擇器是css選擇器,則兩者在根本上是不同的。
2、但是兩者是有交集的,都是作為網(wǎng)頁(yè)或者瀏覽器解析的語(yǔ)言,而js可以通過(guò)修改瀏覽器的dom對(duì)象來(lái)實(shí)現(xiàn)對(duì)css修改或者是控制。
3、可以簡(jiǎn)單的這樣區(qū)分兩者,css選擇器用語(yǔ)css當(dāng)中,js選擇器應(yīng)用于js當(dāng)中,只不過(guò)有時(shí)兩者使用相同的id標(biāo)識(shí)來(lái)選擇對(duì)象。