便捷教程网
下载
代码
复制
代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Code Highlight Example</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.23.0/themes/prism.min.css" /> <script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.23.0/prism.min.js"></script> <style> code[class*="language-"],pre[class*="language-"] { padding: 0em; } </style> </head> <body> <pre><code class="language-javascript"> // 这里是要高亮显示的代码 function helloWorld() { console.log('Hello, World!Hello, World!Hello, World!Hello, World!Hello, World!Hello, World!Hello, World!Hello, World!'); } helloWorld(); </code></pre> <pre><code class="language-javascript line-numbers"> // 这里是要高亮显示的代码 function helloWorld() { console.log('Hello, World!Hello, World!Hello, World!Hello, World!Hello, World!Hello, World!Hello, World!Hello, World!'); } helloWorld(); </code></pre> <pre><code class="language-css"> .aaa{ color:red; } </code></pre> <pre><code class="language-html"> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Sample HTML</title> </head> <body> <h1>Hello, World!</h1> <p>This is a sample HTML code block highlighted by Prism.js.</p> <scritp> // 这里是要高亮显示的代码 function helloWorld() { console.log('Hello, World!Hello, World!Hello, World!Hello, World!Hello, World!Hello, World!Hello, World!Hello, World!'); } helloWorld(); </scritp> <style> .aaa{ color:red; } </style> </body> </html> </code></pre> <pre><code class="language-php"> echo "Hello, World!"; </code></pre> <pre><code class="language-html"> <a href="https://www.baidu.com" target="_blank" class="s-a p-margin-right20">百度</a> </code></pre> </body> </html>
运行
运行结果如下：
结果如下：
尺寸：