層次選擇器是css3的偽類(lèi),css滾動(dòng)條長(zhǎng)短怎么調(diào)?
css設(shè)置滾動(dòng)條寬度的方法:首先使用“::-webkit-scrollbar”偽類(lèi)選擇器選中整個(gè)滾動(dòng)條,然后通過(guò)width屬性設(shè)置滾動(dòng)條寬度,語(yǔ)法格式“::-webkit-scrollbar{width:寬度值;}”。
使用CSS替代JS實(shí)現(xiàn)幾種常見(jiàn)的特效?
可以代替JavaScript的CSS特效有很多,比如說(shuō)通過(guò)偽類(lèi):hover、:actived等實(shí)現(xiàn)觸發(fā)效果,動(dòng)畫(huà)效果可以用animation屬性,對(duì)圖像處理可以transform、filter等
css鼠標(biāo)懸浮變色原理?
1、首先新建一個(gè)html文件,命名為test.html,在test.html文件內(nèi),使用table標(biāo)簽創(chuàng)建一個(gè)表格,用于測(cè)試。
2、在test.html文件內(nèi),設(shè)置table標(biāo)簽的class屬性為mytable,同時(shí)設(shè)置邊框?yàn)?px。
3、接著在css標(biāo)簽內(nèi),通過(guò)class設(shè)置表格的樣式,定義它的寬度為300px,高度為200px。
4、在css標(biāo)簽內(nèi),通過(guò)td元素名稱(chēng)和“:hover”選擇器定義當(dāng)鼠標(biāo)指向單元格時(shí),改變單元格的背景顏色,設(shè)置為紅色。
5、最后在瀏覽器打開(kāi)test.html文件,鼠標(biāo)經(jīng)過(guò)之后,即可變色。
0
偽類(lèi)選擇器hover的使用?
定義和用法:hover 選擇器用于選擇鼠標(biāo)指針浮動(dòng)在上面的元素。提示::hover 選擇器可用于所有元素,不只是鏈接。提示::link 選擇器設(shè)置指向未被訪問(wèn)頁(yè)面的鏈接的樣式,:visited 選擇器用于設(shè)置指向已被訪問(wèn)的頁(yè)面的鏈接,:active 選擇器用于活動(dòng)鏈接。注釋?zhuān)涸?CSS 定義中,:hover 必須位于 :link 和 :visited 之后(如果存在的話),這樣樣式才能生效。代碼效果測(cè)試:
請(qǐng)把鼠標(biāo)指針移動(dòng)到這些鏈接上。
這個(gè)鏈接改變顏色。
這個(gè)鏈接改變字體大小。
這個(gè)鏈接改變背景色。
這個(gè)鏈接改變字體。
這個(gè)鏈接會(huì)出現(xiàn)下劃線。