W3.CSS为以下语言的语法突出显示提供了出色的支持-
- HTML -使用类W3码htmlHigh有HTML代码的容器上。
- CSS -使用类W3码cssHigh有CSS代码在容器上。
- JS-在具有CSS代码的容器上使用w3-code jsHigh类。
您必须包含以下脚本才能链接到js文件,以支持语法突出显示。
<script src = "https://www.w3schools.com/lib/w3codecolors.js"></script>
例子
<html> <head> <title>The W3.CSS Syntax Highlighter</title> <meta name = "viewport" content = "width = device-width, initial-scale = 1"> <link rel = "stylesheet" href = "https://www.w3schools.com/lib/w3.css"> </head> <body> <header class = "w3-container w3-teal"> <h2>HTML Syntax Highlighted</h2> </header> <div class = "w3-code htmlHigh"> <html> <head> <title>The W3.CSS Example</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="css/w3.css"> </head> <body> <header class="w3-container w3-teal"> <h1>Hello World!</h1> </header> </body> </html> </div> <header class="w3-container w3-teal"> <h2>CSS Syntax Highlighted</h2> </header> <div class = "w3-code cssHigh"> .bold { font-weight:bold; } #boldLabel { font-weight:bold; } table, th, td { font-family:sans; } </div> <header class = "w3-container w3-teal"> <h2>JS Syntax Highlighted</h2> </header> <div class = "w3-code cssHigh"> <script type="text/javascript"> function(message){ } var message = "Hello, World!"; alert(message); </script> </div> <script src="https://www.w3schools.com/lib/w3codecolors.js"></script> </body> </html>
作者:terry,如若转载,请注明出处:https://www.web176.com/w3css/944.html