HTML中pre和code的作用和用法

（一）<pre>标签

• 作用：

HTML <pre> 元素表示预定义格式文本。在该元素中的文本通常按照原文件中的编排，以等宽字体的形式展现出来，文本中的空白符（比如空格和换行符）都会显示出来。(紧跟在 <pre> 开始标签后的换行符也会被省略)，非常多页面中的源代码实例都是通过 <pre> 标签定义的

• 用法：

1. 未使用<pre>标签：

<a>关于标签的使用效果</a>

运行结果：

2.使用了<pre>标签：
注意：使用< 代表 "<"，> 代表 ">"

<pre>  <a>关于标签的使用效果  </a></pre>

运行结果：

（二）<code>标签

• 作用：

(1) <code> 标签用于表示计算机源代码或者其他机器可以阅读的文本内容。
软件代码的编写者已经习惯了编写源代码时文本表示的特殊样式。<code> 标签就是为他们设计的。包含在该标签内的文本将用等宽、类似电传打字机样式的字体（Courier）显示出来。
(2)只应该在表示计算机程序源代码或者其他机器可以阅读的文本内容上使用 <code>标签。虽然<code> 标签通常只是把文本变成等宽字体，但它暗示着这段文本是源程序代码。将来的浏览器有可能会加入其他显示效果。例如，程序员的浏览器可能会寻找<code>片段，并执行某些额外的文本格式化处理，如循环和条件判断语句的特殊缩进等。

• 对比用法：
  代码示例：

<a>    
function out (){    
console.log("aaa");   
}
</a>
<br/>
<code>   
 function out(){    
console.log("aaa");    
}
</code>

运行结果：

（三）关于<pre>标签与<code>标签的结合使用

代码示例：

<pre>
<code>    
function out(){    
console.log("aaa");   
 }
</code>    
</pre>

运行结果：