13518219792
這篇文章將為大家詳細(xì)講解有關(guān)dw如何制作鼠標(biāo)經(jīng)過(guò)圖標(biāo)改變顏色，小編覺得挺實(shí)用的，因此分享給大家做個(gè)參考，希望大家閱讀完這篇文章后可以有所收獲。
公司主營(yíng)業(yè)務(wù)：網(wǎng)站建設(shè)、成都網(wǎng)站設(shè)計(jì)、移動(dòng)網(wǎng)站開發(fā)等業(yè)務(wù)。幫助企業(yè)客戶真正實(shí)現(xiàn)互聯(lián)網(wǎng)宣傳，提高企業(yè)的競(jìng)爭(zhēng)能力。創(chuàng)新互聯(lián)建站是一支青春激揚(yáng)、勤奮敬業(yè)、活力青春激揚(yáng)、勤奮敬業(yè)、活力澎湃、和諧高效的團(tuán)隊(duì)。公司秉承以“開放、自由、嚴(yán)謹(jǐn)、自律”為核心的企業(yè)文化，感謝他們對(duì)我們的高要求，感謝他們從不同領(lǐng)域給我們帶來(lái)的挑戰(zhàn)，讓我們激情的團(tuán)隊(duì)有機(jī)會(huì)用頭腦與智慧不斷的給客戶帶來(lái)驚喜。創(chuàng)新互聯(lián)建站推出固安免費(fèi)做網(wǎng)站回饋大家。
方法如下
1、準(zhǔn)備好一對(duì)圖標(biāo)，大小相同，顏色不同。
2、然后在body文檔中，插入第一場(chǎng)圖片，代碼是
3、插入第一張圖片后，在下方插入和他顏色不同的另一張圖片，采用同級(jí)的關(guān)系
4、對(duì)他們的父集ul添加定位position:relative;并對(duì)第一張圖片設(shè)置絕對(duì)定位，ul li:nth-child(1){position:absolute;left:0;top:0;}位置方面可以按照自己需要調(diào)整
5、對(duì)第二張圖片處理方法相同，也是絕對(duì)定位，位置和第一張圖片相同，這樣定位后，后面的第二張圖片會(huì)覆蓋在第一張圖片的上方
ul li:nth-child(2){position:absolute;left:0px;top:0;}
6、在開始前將第二張圖片設(shè)置為隱藏display:none;當(dāng)鼠標(biāo)經(jīng)過(guò)時(shí)顯示第二張圖片
7、設(shè)置完對(duì)第二張圖片的隱藏后，設(shè)置當(dāng)鼠標(biāo)經(jīng)過(guò)ul時(shí)，第二張圖片顯示ul:hover li:nth-child(2){display:block;}
關(guān)于“dw如何制作鼠標(biāo)經(jīng)過(guò)圖標(biāo)改變顏色”這篇文章就分享到這里了，希望以上內(nèi)容可以對(duì)大家有一定的幫助，使各位可以學(xué)到更多知識(shí)，如果覺得文章不錯(cuò)，請(qǐng)把它分享出去讓更多的人看到。
