Wie erstellt: Syntax-Highlighter

Lernen Sie, wie man Syntax-Highlighter erstellt und verwendet.

Syntax-Highlighter

Wenn Sie Farbtöne zu Code-Schnipseln hinzufügen, werden sie leichter lesbar sein:

<!DOCTYPE html> <html> <body> <h1>Testen eines HTML Syntax Highlighters</h2> <p>Hello world!</p> <a href="https://www.codew3c.com">Zurück zum Unterricht</a> </body> </html>









Wie erstellt man einen Syntax-Highlighter


Schritt 1 - Fügen Sie HTML hinzu:


Enthält HTML-Code <div>:


<div id="myDiv">
<!DOCTYPE html><br>
<html><br>
<body><br>
<br>
<h1>Testen eines HTML Syntax Highlighters</h2><br>
<p>Hello world!</p><br>
<a href="https://www.codew3c.com">Zurück zum Unterricht</a><br>
<br>
</body><br>
</html>
</div>



Schritt 2 - Fügen Sie JavaScript hinzu:


Erstellen Sie eine Funktion namens "w3CodeColor" und rufen Sie sie mit einem DIV-Element als Parameter auf:


w3CodeColor(document.getElementById("myDiv"));
function w3CodeColor(elmnt) {
  // Klicken Sie auf "Selbst ausprobieren", um das JavaScript zu sehen...
}



Versuchen Sie es selbst