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
支付宝
微信