pre标签在网页中实现大段代码预格式化显示应用.pdfVIP

使用pre为你的网页加入大段代码

在上节中介绍加入一行代码的为code，但是在大多数情况下是需要加入大段代码的，如下图：

？不会是每一代码都加入一个code吧，没有这么复杂，这时候就可以使用pre。

语法：

pre语言代码段/pre

pre的主要作用:预格式化的文本。被包围在pre元素中的文本通常会保留空格和换行符。

如下代码：

pre

varmessage=欢迎;

for(vari=1;i=10;i++)

{

alert(message);

}

/pre

Usethepretagtoaddlargechunksofcodetoyour

webpages

Intheprevioussection,thelabelforaddingalineofcodewasintroducedascode,butinmostcasesitisnecessarytoaddalargesectionof

code,asshownbelow:

WhatshouldIdo?Insteadofaddingacodetagtoeverycode,itisnotthatcomplicated.Atthistime,youcanusethepretag.

语法：

prelanguagesnippet/pre

Themainfunctionofthepretag:preformattedtext.Textenclosedinapreelementusuallypreserveswhitespaceandnewlines.

Thefollowing

code:

pre

=10;i++)

{

}

/pre

在浏览器中的显示结果为：

在上面的例子中可以看到代码中的空格，换行符都保留下来。如果用以前的方法，回车需要输入br签，

空格需要输入;

注意：pre不只是为显示计算机的源代码时用的，在你需要在网页中预显示格式时都可以使用它，

只是pre的一个常见应用就是用来展示计算机的源代码。

Theresultdisyedinthebrowseris:

Intheaboveexample,youcan