HTML 中的引用標籤-html教學-PHP中文網

HTML 中引用標籤的元素

範例 #1 – ;標籤

HTML 中的引用標籤範例

範例#3

結論

首頁

web前端

html教學

HTML 中的引用標籤

王林

Sep 04, 2024 pm 04:22 PM

html html5 HTML Tutorial HTML Properties HTML tags

HTML 中的引用標籤用於使用顯示簡短的引用。標籤。它包含在和之間。 …… 。它有助於表明所包含的文本位於內聯引用中。對於簡短的引用，我們將使用 ... 標籤，而對於長引用，我們將使用名為

的 HTML 標籤。 ....

。此標籤專門用於指示網頁瀏覽器上與普通文字不同的文字。

標籤在 HTML 中用於表示網頁文件中的區塊級引用。這些標籤對於樣式設計最有用，因為它們將網頁的流程分配到不同的部分。

文法：

<q> Some text </q>

登入後複製

此標籤用於在 HTML 文件中顯示內嵌引用。

<blockquote> Some text </blockquote>

登入後複製

該標籤用於顯示區塊級引用。它有助於更改文字的位置並使其與其他元素不同。該標籤使用名為 cite 的屬性，該屬性有助於定義引文的實際來源。

HTML 中引用標籤的元素

以下是我們將在引號標籤中使用的最有用的元素：

範例 #1 – ;標籤

此標籤用於在 HTML 文件上顯示地址，將文字放入地址標籤中，如下所示：

文法：

<address>  some text </address>

登入後複製

代碼：

<!DOCTYPE html>
<html>
<head>
<title>abbr element </title>
</head>
<body>
<address>156, devanagri, <br>
Near shanoormiya darga, <br>
Aurangabad
</address>
</body>
</html>

登入後複製

輸出：

HTML 中的引用標籤

範例 #2 – 標籤

可以使用此元素定義文字的縮寫。每當使用者將滑鼠懸停在該標籤上時，它就會顯示文字的縮寫。

文法：

<abbr> Text </abbr>

登入後複製

代碼：

<!DOCTYPE html>
<html>
<head>
<title>abbr element </title>
</head>
<body>
<p>Welcome to <abbr title="Beautiful
Automation System">Beautosys</abbr></p>
</body>
</html>

登入後複製

輸出：

HTML 中的引用標籤

範例 #3 – 標籤

引號標籤中的這個標籤用來定義雙向覆蓋。它會改變 HTML 元素中的實際文字方向。

文法：

<bdo dir=”value”> text </bdo>

登入後複製

這裡的dir值可以是ltr表示從左到右方向或rtl表示從右到左方向。

代碼：

<!DOCTYPE html>
<html>
<body>
<p> Uday wire Industries </p>
<p><bdo dir=”ltr” >Uday wire Industries </bdo></p>
</body>
</html>

登入後複製

輸出：

HTML 中的引用標籤

範例 #4 – 標籤

這用於顯示內嵌文字引用。

文法：

<q> text </q>

登入後複製

代碼：

<!DOCTYPE html>
<html>
<body>
<q>Sisters are the choc chips in the era of biscuits </q>
</body>
</html>

登入後複製

輸出：

HTML 中的引用標籤

範例 #5 –
;標籤

這用來表示網路文件中的區塊級引用。

文法：

<blockquote> contents </blockquote>

登入後複製

代碼：

<!DOCTYPE html>
<html>
<head>
<title> Quotation tag in HTML </title>
</head>
<body>
<p> Uday wire Industries </p>
<p><blockquote> In the era of making new friends and showing
off , I just wish one thing, that my old one’s stay; No matter what
the   trend is.</blockquote>
</p>
</body>
</html>

登入後複製

輸出：

HTML 中的引用標籤

HTML 中的引用標籤範例

以下是範例：

範例#1

讓我們來看一個例子來說明如何使用引用標籤。它還包括地址標籤、縮寫標籤和不同的引號標籤。

代碼：

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
* {
box-sizing: border-box;
}
.qtag{
background-color: burlywood;
border-color: crimson;
border-style: dashed;
}
</style>
</head>
<body>
<div class="qtag">
<h2 style="color:brown;">Quotation Tags Example</h2>
<h4>Address tag</h4>
<address>
<blockquote>
<p> 176, Kauslya kunj <br>
Andaman Hill , Pangari Road <br>
Chandigad <br>
<b>Contact US</b><br>
Contact No: 9968795334 <br>
EmailD: [email protected]<br>
</p>
</blockquote>
</address>
<h4>Abbreviation tag</h4>
<p>
<q>Being with <abbr title="Beautiful Automation Systems ">BEAUTOSYS </abbr> for marvelous growth into your business, Automation in technology and many more.......  ! Stay Connected </q>
</p>
<p>Be connected with us for Software services, Automation in new technologies, Embedded services, Responsive Websites and Mechanical services </p>
<h5>Stay Connected!</h5>
</div>
</body>
</html>

登入後複製

輸出：

HTML 中的引用標籤

範例#2

讓我們來看一個例子來說明如何使用引用標籤。它包括 bdo 標籤。

代碼：

<!DOCTYPE html>
<html>
<body>
<h2>bdo tag in quotation</h2>
<p>dir value in the bdo tag defines the direction from which direction text is going to move and it will  generate output. <b>rtl </b>value defines text will moves from right to left direction where as <b>ltr</b></p>
<h4>bdo tag</h4>
<p>Tere is no success like failure. <br>
<bdo dir="rtl">Tere is no success like failure.</bdo> </p>
<p>I get knocked down. But I get up again. You’re never going to keep me down <br>
<q><bdo dir="ltr">I get knocked down. But I get up again. You’re never going to keep me down</bdo></q> </p>
<p>Don’t let what you cannot do interfere with what you can do.” <br>
<bdo dir="rtl">Don’t let what you cannot do interfere with what you can do.”</bdo></p>
<p>The secret of getting ahead is getting started
<q><bdo dir="ltr">The secret of getting ahead is getting started</bdo></q>
</p>
<p>Success iss the sum of small efforts , Repeated day_in and day_out.<br>
<bdo dir="rtl">Success iss the sum of small efforts , Repeated day_in and day_out.</bdo>
</p>
</body>
</html>

登入後複製

輸出：

HTML 中的引用標籤

範例#3

此範例顯示內聯和區塊級文字的引用，如下所示：

代碼：

<!DOCTYPE html>
<html>
<body>
<p> Quotation  <b>q</b> tag </p>
<p><q> Success demands singleness of purpose.</q></p>
<p><q>Choosing a goal and sticking to it changes everything.</q></p>
<p><q> Choose a job you love, and you will never have to work a day in your life!.</q></p>
<p><q> The most important thing about motivation is goal setting .You should always have a goal</q></p> <br>
<p>Quotation <b>blockquote </b> tag for Block </p>
<h4>Big data is advance Telemedicine</h4>
<blockquote> <p>Big data is making impact in every field now a day. By using latest technology  in telemedicine field , one can get more information about their diseases ,so they can take more care using telemedicine. </p></blockquote>
</body>
</html>

登入後複製

輸出：

HTML 中的引用標籤