第12講 超鏈接

1、版權(quán)所有陜西新華電腦軟件學(xué)校-電子商務(wù)教研組第12講 豐富的超鏈接特效版權(quán)所有陜西新華電腦軟件學(xué)校-電子商務(wù)教研組任務(wù)一 動態(tài)超鏈接任務(wù)三 浮雕式超鏈接（重點(diǎn)）超鏈接超鏈接特效特效教學(xué)重難點(diǎn)教學(xué)重難點(diǎn)任務(wù)二 按鈕式超鏈接2任務(wù)四 讓下劃線動起來（重點(diǎn)）版權(quán)所有陜西新華電腦軟件學(xué)校-電子商務(wù)教研組任務(wù)一任務(wù)一 動態(tài)超鏈接動態(tài)超鏈接u超鏈接是網(wǎng)頁上最普通的元素，默認(rèn)情況下，超鏈接統(tǒng)一為藍(lán)色并有下劃線，訪問過的超鏈接為紫色并有下劃線u通過CSS可以設(shè)置超鏈接的各種屬性，包括字體、顏色、背景等，而且通過偽類別還可以制作很多動態(tài)效果u去掉超鏈接的下滑線：atext-decoration:none;u此時

2、，無論是超鏈接本身，還是訪問過的超鏈接，下劃線都被去掉了，與普通文字沒有什么區(qū)別3版權(quán)所有陜西新華電腦軟件學(xué)校-電子商務(wù)教研組u超鏈接的偽類 示例4版權(quán)所有陜西新華電腦軟件學(xué)校-電子商務(wù)教研組任務(wù)二任務(wù)二 按鈕式超鏈接按鈕式超鏈接u很多網(wǎng)頁上的按鈕式超鏈接都采用了各種圖片，我們通過CSS的普通屬性來模擬按鈕的效果u首先建立簡單的菜單結(jié)構(gòu)，用標(biāo)記直接排列，對標(biāo)記進(jìn)行整體的控制，加入CSS的3個偽屬性對普通的超鏈接和點(diǎn)擊過的超鏈接采用相同樣式，并利用邊框樣式模擬按鈕效果u示例5版權(quán)所有陜西新華電腦軟件學(xué)校-電子商務(wù)教研組任務(wù)三任務(wù)三 浮雕式超鏈接浮雕式超鏈接u將背景圖加入到超鏈接的偽屬性中可以制作出更多絢麗的效果u示例6版權(quán)所有任務(wù)任務(wù)四四 讓下劃線動起來讓下劃線動起來u步驟：p制作兩組動態(tài)圖像版權(quán)所有任務(wù)任務(wù)四四 讓下劃線動起來讓下劃線動起來u步驟p書寫HTML代碼版權(quán)所有任務(wù)任務(wù)四四 讓下劃線動起來讓下劃線動起來u步驟p書寫CSS代碼版權(quán)所有注意：注意：uCSS是通過4個為類別來設(shè)置各種動態(tài)的鏈接效果，這里必須指出1個問題：p順序版權(quán)所有陜西新華電腦軟件學(xué)校-電子商務(wù)教研組本講總結(jié)本講總結(jié) 本講學(xué)習(xí)超鏈接的偽類，利用偽類屬性制作出各種超鏈接效果。11版權(quán)所有陜西新華電腦軟件學(xué)校-電子商務(wù)教研組本講作業(yè)本講作