不用CSS用JS實(shí)現(xiàn)鏈接樣式的變化

2012/10/27 17:20:51作者：佚名來源：網(wǎng)絡(luò)

移動端

【實(shí)例名稱】

不用CSS實(shí)現(xiàn)鏈接樣式的變化

【實(shí)例描述】

通常樣式的改變都需要使用CSS樣式表完成。本例將使用JavaScript提供的樣式屬性．直接改變鏈接的樣式。

【實(shí)例代碼】

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>標(biāo)題頁-學(xué)無憂（denvermotorcycleaccidentlawyer.com）</title>
</head>
<body>
<a href="http://www.baidu.com" style="color:navy"
onmouseover="this.style.fontWeight='bold';"
onmouseout="this.style.fontWeight='normal';">
把鼠標(biāo)移動過來試驗(yàn)一下</a></body>
</html>

【運(yùn)行效果】

鼠標(biāo)移入之前的效果

運(yùn)行效果

鼠標(biāo)移到鏈接上的效果

運(yùn)行效果

【難點(diǎn)剖析】

本例的重點(diǎn)是JavaScript中的“style”屬性。此屬性包含了對象(如文本框、鏈接等)常用的一些樣式設(shè)置，如字體、顏色邊框等。在JavaScript中，可以直接使用“this’’調(diào)用當(dāng)前鼠（或光標(biāo))所指的對象，然后使用“sytle”屬性設(shè)置其樣式。

【源碼下載】

如果你不愿復(fù)制代碼及提高代碼準(zhǔn)確性，你可以點(diǎn)擊：不用CSS實(shí)現(xiàn)鏈接樣式的變化進(jìn)行本實(shí)例源碼下載

標(biāo)簽： CSS 鏈接 JS