pre标签

1.pre标签的定义:

<pre>标签用来定义预格式化的文本，被包围在pre标签中的文本通常会保留空格和换行符， 而文本也会呈现出等宽字体。同样，pre标签的一个常见的应用便是用来保存计算机中的源代码文本。示例如下：

代码：

<pre> 
   html中pre和code标签,       html中pre和code标签   
   html中pre和code标签, html中pre和code标签    

   html中pre和code标签
</pre>

效果：

pre在浏览器中的效果.png

2.pre标签的功能:

pre标签一个常见的应用便是用来保存计算机中的源代码的文本。但是，需要注意的是， 可以导致段落断开的标签（例如标题、<p> 和 <address> 标签）绝不能包含在 <pre> 所定义的块里。 pre标签允许的文本可以包括物理样式和基于内容的样式变化，还有链接、图像和水平分隔线。 当把其他标签（比如 <a> 标签）放到 <pre> 块中时，就像放在 HTML/XHTML 文档的其他部分中一样即可。示例如下：

代码:

<pre>  
    &lt;html&gt;
    &lt;head&gt;
    &lt;script type=&quot;text/javascript&quot;           src=&quot;loadxmldoc.js&quot;&gt;
    &lt;/script&gt;
    &lt;/head&gt;
    &lt;body&gt;
    &lt;script type=&quot;text/javascript&quot;&gt;
xmlDoc=&lt;<font     color="blue">a&nbsp;href="dom_loadxmldoc.asp"&gt;loadXMLDoc&lt;/a    &gt;</font>(&quot;books.xml&quot;);
document.write(&quot;xmlDoc is loaded, ready for use&quot;);
    &lt;/script&gt;
    &lt;/body&gt;
    &lt;/html&gt;
</pre>

效果：

pre标签.png

code标签

1.code标签的定义:

<code>标签， 用于表示计算机源代码或者其他机器可以阅读的文本内容。软件代码的编写 者习惯了编写代码时的代码格式，那么这个<code>标签就是为软件代码编写者设计的， code标签内的文本将用等宽、类似电传打字机样式的字体（Courier）显示出来。

2.code标签的应用:

应该是只用在表示计算机程序源代码或者其他机器可以阅读的文本内容上。<code> 标签的功能有：将文本变成等宽字体；还有一个功能就是暗示这段文本是源程序代码。那么根据第二个功能，将来浏览器可能会根据自己的实际情况添加效果。例如，程序员的浏览器可能会寻找 <code> 片段，并执行某 些额外的文本格式化处理，如循环和条件判断语句的特殊缩进等。

代码：

<code>
       var a;
       var b=document.getELementById("id1").value;
       var c=document.getELementById("id2").value;
         
       return a+b+c;
</code>

效果：

code使用.png

code和pre之间的关系

共同点：都主要应用于浏览器显示计算机中的源代码。
不同点： code标签的一个功能是暗示浏览器code标签所包围的文本是计算机源代码，浏览器可以做出自己的 样式处理，pre标签则没有这项功能，但是pre标签可以保留文本中的空格和换行符，保留文本中的空格和换行符是计算机源代码显示 所必须的样式。code标签和pre标签是 可以嵌套使用的，但是必须注意两者的嵌套顺序。