What is the role of html pre tag? Detailed explanation of html pre tag usage and its attributes-HTML Tutorial-php.cn

What is the role of html pre tag? Detailed explanation of html pre tag usage and its attributes

寻∝梦

Release： 2018-08-18 17:18:48

Original

17236 people have browsed it

html pre标签的作用是什么？html pre标签用法及其属性详解你知道吗？那么今天的这篇文章给大家讲解了html pre标签的定义和用法，还有关于html pre标签的作用和使用说明

html pre标签的定义和用法：

pre 元素可定义预格式化的文本。被包围在 pre 元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体。

 标签的一个常见应用就是用来表示计算机的源代码。</p>
<p>可以导致段落断开的标签（例如标题、<p> 和 <address> 标签）绝不能包含在 <pre class="brush:php;toolbar:false"> 所定义的块里。尽管有些浏览器会把段落结束标签解释为简单地换行，但是这种行为在所有浏览器上并不都是一样的。</p>
<p>pre 元素中允许的文本可以包括物理样式和基于内容的样式变化，还有链接、图像和水平分隔线。当把其他标签（比如 <a> 标签）放到 <pre class="brush:php;toolbar:false"> 块中时，就像放在 HTML/XHTML 文档的其他部分中一样即可。请看下面的例子：</p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false"><pre class="brush:php;toolbar:false">
&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=<a href="dom_loadxmldoc.asp">loadXMLDoc</a>(&quot;books.xml&quot;);
    document.write(&quot;xmlDoc is loaded, ready for use&quot;);
  &lt;/script&gt;
&lt;/body&gt;
&lt;/html&gt;

Copy after login

标签中的特殊符号被转换为符号实体，比如 "<" 代表 "<"，">" 代表 ">"。另外，请注意蓝色的代码，我们在 <pre class="brush:php;toolbar:false"> 标签中使用了链接，也就是 <a> 标签。上面这段代码的显示效果如下：</p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false"><html> <head> <script type="text/javascript" src="loadxmldoc.js"> </script> </head> <body> <script type="text/javascript"> xmlDoc=loadXMLDoc("books.xml"); document.write("xmlDoc is loaded, ready for use"); </script> </body> </html>

标签的作用及使用说明：</strong></p><p>1、该标签可定义预格式化的文本，被包围在 pre 元素中的文本通常会保留空格和换行符，并且文本会呈现为等宽字体。该标签的一个常见应用就是用来表示计算机的源代码。</p><p>2、该元素中允许的文本可以包括物理样式和基于内容的样式变化，还有链接、图像和水平分隔线。当把其他标签（比如 <a> 标签）放到 <pre class="brush:php;toolbar:false"> 块中时，就像放在 HTML/XHTML 文档的其他部分中一样即可。</p><p>3、标签中的特殊符号被转换为符号实体，比如 "<" 代表 "<"，">" 代表 ">"。</p><p>4、可以导致段落断开的标签（比如<h1>、<p> 和 <address> 标签）尽量不要包含在 <pre class="brush:php;toolbar:false"> 所定义的块里，我试过现在的浏览器（Google、IE和火狐），虽然可以把段落结束标签解释为简单地换行，但是在代码编辑器里会报错 "Invalid location of tag (h1)."</p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:html;toolbar:false"><!DOCTYPE html> <html> <head> <meta charset="utf-8"> </head> <body> <pre class="brush:php;toolbar:false">你好我是Natalie 我即将成为<h1>一名技术</h1>人员。

标签定义的块当中可以起到应有的作用，每个制表符占据 8 个字符的位置。但是我们不推荐使用它，因为在不同的浏览器中，Tab 的实现各不相同。在用

标签格式化的文档段中使用空格，可以确保文本正确的水平位置。

提示：如果您希望使用

标签来定义计算机源代码，比如 HTML 源代码，请使用符号实体来表示特殊字符，比如 "<" 代表 "<"，">" 代表 ">"，"&" 代表 "&"。

提示：在 W3School 中，非常多页面中的源代码实例都是通过

 标签定义的，您可以参考这些页面，学习如何使用该标签。我们甚至把  标签与  标签结合起来使用，以获得更加精确的语义。
【相关推荐】
html5 border属性怎么设置？html5 table中的border属性介绍

HTML ins标签常用的用法有哪些？HTML ins常用属性的介绍




The above is the detailed content of What is the role of html pre tag? Detailed explanation of html pre tag usage and its attributes. For more information, please follow other related articles on the PHP Chinese website!