作成方法：構文ハイライト

構文ハイライトの作成と使用方法を学びます。

構文ハイライト

コードスニペットに色を追加すると、読みやすくなります：

<!DOCTYPE html> <html> <body> <h1>HTML構文ハイライトのテスト</h2> <p>Hello world!</p> <a href="https://www.codew3c.com">学校に戻る</a> </body> </html>









構文ハイライトの作成方法


第1ステップ - HTMLを追加：


HTMLコードを含む<div>：


<div id="myDiv">
<!DOCTYPE html><br>
<html><br>
<body><br>
<br>
<h1>HTML構文ハイライトのテスト</h2><br>
<p>Hello world!</p><br>
<a href="https://www.codew3c.com">学校に戻る</a><br>
<br>
</body><br>
</html>
</div>



第2ステップ - JavaScriptを追加：


「w3CodeColor」という関数を作成し、DIV要素を引数として渡して呼び出します：


w3CodeColor(document.getElementById("myDiv"));
function w3CodeColor(elmnt) {
  //クリックして「自分で試す」を確認してください
}



}