文字スタイル変更(color, fontWeight, fontStyle, textDecoration, fontFamily)
<html> <head> <title>文字スタイル変更(文字色・太字・斜体・下線・明朝体・背景色・枠)</title> <script language="JavaScript"> <!-- function change1() { text1.style.color = "red"; } function change2() { text2.style.fontWeight = "bold"; } function change3() { text3.style.fontStyle = "italic"; } function change4() { text4.style.textDecoration = "underline"; } function change5() { text5.style.fontFamily = "MS 明朝"; } function change6() { text6.style.border = "solid 2px #ff0000"; } function change7() { text7.style.backgroundColor = "#99ff99"; } //--> </script> </head> <body> <p> それぞれの文字の上にマウスカーソルが来たとき文字スタイルが変わります。<br> <br> <span id="text1" onMouseover="change1()">文字色赤</span><br> <br> <span id="text2" onMouseover="change2()">太字</span><br> <br> <span id="text3" onMouseover="change3()">斜体</span><br> <br> <span id="text4" onMouseover="change4()">アンダーライン</span><br> <br> <span id="text5" onMouseover="change5()">明朝体</span><br> <br> <span id="text6" onMouseover="change6()">枠</span><br> <br> <span id="text7" onMouseover="change7()">背景色</span><br> </p> </body> </html>
〔 実行する 〕