HTML-预文本格式&计算机输出标签

来源：互联网发布：fms飞机淘宝编辑：程序博客网时间：2024/06/06 12:58

1.预文本格式标签：<pre>

（1）用来定义预格式化的文本，被包围在此标签中的文本通常会保留空格和换行符，并且文本也会以等宽形式呈现

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

2.计算机输出标签

（1）<code>标签，定义计算机代码或者其他机器可以阅读的文本内容，将文本内容以等宽、类似电传打字机样式的字体（courier）显示出来，而且也暗示这段文本表示计算机的源代码，但浏览器可以做出自己的样式处理

（2）<kbd>标签，定义键盘码，当我们需要表达键盘输入文本时，从Web标准的角度出发，强烈建议使用这个标签，因为，它更具语义化，搜索引擎也更能读懂它

（3）<samp>标签，定义计算机代码样本

（4）<tt>标签，定义打字机代码

（5）<var>标签，定义变量

示例代码：

<html><body bgcolor="pink"> <!--预文本格式化-->for i = 1 to 9print inext i<pre>for i = 1 to 10print inext i</pre><br/><code>for i = 1 to 11print inext i</code><br/><kbd>for i = 1 to 12print inext i</kbd><br/>Please input <kbd>quit</kbd> to exit<br/><tt>for i = 1 to 13print inext i</tt><br/><samp>for i = 1 to 14print inext i</samp><br/><var>for i = 1 to 15print inext i</var></body></html>

展现效果：

（6）<address>标签，定义地址，默认斜体显示标签里的内容

示例代码：

<html><body bgcolor="pink"><!--地址标签--><address>Written by <a href="mailto:test@example.com"> Tester </a>Visit us at:<br/>Example.com<br/>Box 111,New York <br/>USA</address></body></html>

展现效果：

（7）<abbr>和<acronym>标签，分别表示定义网页中呈现的文字的缩写和简称，都通过title属性来给出缩写的完整名称，区别在于，<acronym>标记用来表示首字母缩略词，并且往往缩写形式是一个可发音的单词

示例代码：

<html><body bgcolor="pink"><!--首字母缩写--><abbr title="World Wide Web">WWW</abbr><br/><acronym title="North Atlantic Treaty Organization">NATO</acronym><br></body></html>

展现效果：

（8）<dbo>标签，定义文字方向，rtl（right to left）表示倒序，ltr表示正序

示例代码：

<html><body bgcolor="pink"><!--定义文字方向标签dbo，rtl表示right to left反序，ltr正序--><bdo dir="rtl">Here is some Hebrew text</bdo></body></html>

展现效果：

（9）<blockquote>和<q>标签，<blockquote>标签定义长引用，默认带有左右40px的外间距，不带双引号；而<q>标签表示短引用，在内容的开始和结尾处包含双引号

示例代码：

<html><meta charset="utf-8"><body bgcolor="pink"><!--定义块引用，blockquote表示长引用，q表示短的引用-->1.以下表示长引用：<br/><blockquote>    这是长的引用。abcdefgABCDEFG</blockquote><br/>2.以下表示短引用:<br/><q>    这是短的引用。12345</q></body></html>

展示效果：

0 0