HTML“計算機輸出”標簽


 我們並不反對使用它們,但是如果您只是為了達到某種視覺效果而使用這些標簽的話,我們建議您使用樣式表,那么做會達到更加豐富的效果。

 <code> 標簽-定義計算機代碼文本。

定義和用法:

<code> 標簽用於表示計算機源代碼或者其他機器可以閱讀的文本內容。

軟件代碼的編寫者已經習慣了編寫源代碼時文本表示的特殊樣式。<code> 標簽就是為他們設計的。包含在該標簽內的文本將用等寬、類似電傳打字機樣式的字體(Courier)顯示出來,對於大多數程序員和 W3School 的用戶來說,這應該是十分熟悉的。

只應該在表示計算機程序源代碼或者其他機器可以閱讀的文本內容上使用 <code> 標簽。雖然 <code> 標簽通常只是把文本變成等寬字體,但它暗示着這段文本是源程序代碼。將來的瀏覽器有可能會加入其他顯示效果。例如,程序員的瀏覽器可能會尋找 <code> 片段,並執行某些額外的文本格式化處理,如循環和條件判斷語句的特殊縮進等。

 提示和注釋

 提示:如果只是希望使用等寬字體的效果,請使用 <tt> 標簽。或者,如果想要在嚴格限制為等寬字體格式的文本中顯示編程代碼,請使用 <pre> 標簽。

 <kbd> 標簽-定義鍵盤文本

定義和用法:

<kbd> 標簽定義鍵盤文本。

說到技術概念上的特殊樣式時,就要提到 <kbd> 標簽。正如你已經猜到的,它用來表示文本是從鍵盤上鍵入的。

瀏覽器通常用等寬字體來顯示該標簽中包含的文本。

<kbd> 標簽經常用在於計算機相關的文檔和手冊中。

<samp> 標簽-定義樣本文本。

定義和用法:

<samp> 標簽表示一段用戶應該對其沒有什么其他解釋的文本字符。要從正常的上下文抽取這些字符時,通常要用到這個標簽。

請看下面的例子:

字符序列 <samp>ae</samp> 可能會被轉換為 &aelig; 連字字符。

上面的 HTML 代碼會顯示為:

字符序列 ae 可能會被轉換為 æ 連字字符。

注釋:在 HTML 中,用於 "ae" 連字的特殊實體是 "&aelig;",大多數瀏覽器都會將它轉換成相應的 "æ" 連字字符。

<samp> 標簽並不經常使用。只有在要從正常的上下文中將某些短字符序列提取出來,對它們加以強調的極少情況下,才使用這個標簽。

<tt> 標簽-定義打字機代碼。

定義和用法:

<tt> 標簽呈現類似打字機或者等寬的文本效果。

<tt> 標簽與 <code> 和 <kbd> 標簽一樣,<tt> 標簽和必需的 </tt> 結束標簽告訴瀏覽器,要把其中包含的文本顯示為等寬字體。對於那些已經使用了等寬字體的瀏覽器來說,這個標簽在文本的顯示上就沒有什么特殊效果了。

<var> 標簽-定義變量。

定義和用法:

<var> 標簽表示變量的名稱,或者由用戶提供的值。

<var> 標簽是計算機文檔中應用的另一個小竅門,這個標簽經常與 <code> 和 <pre> 標簽一起使用,用來顯示計算機編程代碼范例及類似方面的特定元素。

用 <var> 標簽標記的文本通常顯示為斜體。

就像其他與計算機編程和文檔相關的標簽一樣,<var> 標簽不只是讓用戶更容易理解和瀏覽你的文檔,而且將來某些自動系統還可以利用這些恰當的標簽,從你的文檔中提取信息以及文檔中提到的有用參數。我們再一次強調,提供給瀏覽器的語義信息越多,瀏覽器就可以越好地把這些信息展示給用戶。

<pre> 標簽-定義預格式文本。

定義和用法:

pre 元素可定義預格式化的文本。被包圍在 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=<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;
</pre>

在上面的代碼中,<pre> 標簽中的特殊符號被轉換為符號實體,比如 "&lt;" 代表 "<","&gt;" 代表 ">"。另外,請注意藍色的代碼,我們在 <pre> 標簽中使用了鏈接,也就是 <a> 標簽。上面這段代碼的顯示效果如下:

<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>

提示和注釋

提示:制表符(tab)在 <pre> 標簽定義的塊當中可以起到應有的作用,每個制表符占據 8 個字符的位置。但是我們不推薦使用它,因為在不同的瀏覽器中,Tab 的實現各不相同。在用 <pre> 標簽格式化的文檔段中使用空格,可以確保文本正確的水平位置。

提示:如果您希望使用 <pre> 標簽來定義計算機源代碼,比如 HTML 源代碼,請使用符號實體來表示特殊字符,比如 "&lt;" 代表 "<","&gt;" 代表 ">","&amp;" 代表 "&"。

提示:在 W3School 中,非常多頁面中的源代碼實例都是通過 <pre> 標簽定義的,您可以參考這些頁面,學習如何使用該標簽。我們甚至把 <pre> 標簽與 <code> 標簽結合起來使用,以獲得更加精確的語義。

 例子:預格式文本

此例演示如何使用 pre 標簽對空行和空格進行控制。

<pre>
這是
預格式文本。
它保留了      空格
和換行。
</pre>

<p>pre 標簽很適合顯示計算機代碼:</p>

<pre>
for i = 1 to 10
     print i
next i
</pre>

例子:“計算機輸出”標簽

此例演示不同的“計算機輸出”標簽的顯示效果。

<code>Computer code</code>
<br />
<kbd>Keyboard input</kbd>
<br />
<tt>Teletype text</tt>
<br />
<samp>Sample text</samp>
<br />
<var>Computer variable</var>
<br />

<p>
<b>注釋:</b>這些標簽常用於顯示計算機/編程代碼。
</p>

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM