HTML - <code> 標籤

HTML 的 <code> 標籤用於定義一段計算機程式碼。或者換句話說，<code> 標籤用於將變數、程式程式碼片段等插入 HTML 文件中。預設情況下，瀏覽器中內容文字將使用預設的等寬字型顯示。HTML 提供了許多文字格式化方法，但 <code> 標籤以固定的字號、字型和間距顯示。

語法

<code>...</code>

屬性

HTML code 標籤支援 HTML 的全域性和事件屬性。

HTML code 標籤示例

在下面的示例中，我們將看到 code 標籤的使用，以及與其相關的標籤，例如<samp>、<kbd>、<var>和<pre>標籤。我們還將使用內部 CSS 來設定 code 標籤的樣式。

code 元素的預設樣式

在下面的示例中，讓我們看看如何在 HTML 文件中使用 <code> 標籤。

<!DOCTYPE html>
<html>
<body>
   <h2>TutorialsPoint</h2>
   <p> Simply Easy Learning
      <code>HTML Tutorial</code> 
   </p>
</body>
</html>

將 code 標籤與其他替換標籤一起使用

在這個例子中，我們將看到其他可以使用的類似標籤。HTML code 標籤並未被棄用。

<!DOCTYPE html>
<html>
<body>
    <h3>
      Bellow we have used 4 other tags that 
      can be replacement of code tag
    </h3>
    <code>This is code Element</code>
    <br>
    <samp>This is samp Element</samp>
    <br>
    <kbd>This is kbd Element</kbd>
    <br>
    <var>This is var Element</var>
    <br>
    <pre>This is code Element</pre>
</body>
</html>

在 HTML 中指定其他語言

考慮以下示例，我們正在建立一個 HTML 文件，並使用 <code> 標籤來顯示一個單行的 C++ 程式。

<!DOCTYPE html>
<html>
<body>
   <h2>CPP Program</h2>
   <code>int a, b, c; a = 20, b = 30, c = 40;</code>
</body>
</html>

使用內部 CSS 設定 code 元素的樣式

讓我們來看下面的例子，我們在這裡建立一個 HTML 文件，使用 <code> 標籤和 CSS 屬性來設定 <code> 內容的樣式。

<!DOCTYPE html>
<html>
<head>
   <style>
      code {
      color: red;
      font-family: verdana;
      }
   </style>
</head>
<body>
   <h2>TutorialsPoint</h2>
   <code>HTML Tutorial</code> 
</body>
</html>

支援的瀏覽器

標籤
code	支援	支援	支援	支援	支援

html_tags_reference.htm

列印頁面