html和css实现在网页中输出程序员代码并且对程序代码高亮显示

可以使用`<pre>`和`<code>`标签展示代码,并结合CSS设置高亮样式。 HTML代码示例:

```html
<pre>
  <code class="highlight">
    // 你的代码在这里
    function helloWorld() {
      console.log("Hello, world!");
    }
  </code>
</pre>
```

CSS代码示例:

```css
.highlight {
  background-color: #f3f3f3;
  color: #333;
  font-family: 'Courier New', Courier, monospace;
  padding: 10px;
  border-radius: 5px;
}
```

这里采用了`<pre>`标签来保留原有的格式,又使用了`<code>`标签嵌套指定代码高亮的样式。同时,可以通过设置`.highlight`类的样式,让代码高亮显示。

相关代码参考