HTML - <q> 標籤



HTML <q> 標籤用於定義簡短的引用。它表示包含的文字是簡短的內聯引用,瀏覽器預設情況下會在引用周圍加上引號。此標籤適用於不需要段落換行的簡短引用。

語法

<q>.....</q>

屬性

HTML q 標籤支援 HTML 的全域性事件屬性。還有一個特定的屬性,如下所示。

HTML q 標籤屬性

屬性 描述
cite URL 儲存指定引文來源的 URL。

HTML q 標籤示例

在以下示例中,我們將看到使用案例,在哪裡以及如何使用 HTML q 標籤來引用任何簡短文字。

指定簡短引用

在以下示例中,讓我們看看 <q> 標籤在 HTML 文件中的用法。

<!DOCTYPE html>
<html>
<body>
   <p>
      When Dave asks HAL to open the pod bay door, 
      HAL answers: <q cite=
"https://www.imdb.com/title/tt0062622/quotes/qt0396921">
      I'm sorry, Dave. 
      I'm afraid I can't do that. 
   </q>
   </p>
</body>
</html>

設定簡短引用的樣式

考慮以下示例,我們正在使用 <q> 標籤,並使用 CSS 屬性設定 q 標籤內容的樣式。

<!DOCTYPE html>
<html>
<head>
   <style>
      q {
         color: green;
         font-style: italic;
      }

      p {
         color: green;
         font-size: 30px;
      }
   </style>
</head>
<body>
   <h1>HTML q Tag</h1>
   <p>
      tutorialspoint: <q>Easy to learn!
   </q>
   </p>
</body>
</html>

指定引用的文字來源

讓我們看看下面的示例,我們演示了 <q> 標籤及其屬性,並使用 CSS 屬性設定 <q> 標籤內容的樣式。

<!DOCTYPE html>
<html>
<head>
   <style>
      q {
         color: green;
         font-style: italic;
      }
   </style>
</head>
<body>
   <h1>The q tag</h1>
   <p>
      <q cite="https://tutorialspoint.tw">tutorialspoint: Easy to learn!</q>
      A EdTech organization which provides the 
      6000+ course and CSE tutorials and courses!
   </p>
</body>
</html>
對於長引用,請使用<blockquote> 標籤

支援的瀏覽器

標籤 Chrome Edge Firefox Safari Opera
q
html_tags_reference.htm
廣告