資料結構
網路
關係型資料庫管理系統
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
時尚研究
法律研究如何在 HTML5 中顯示注音（Ruby Annotation）？
註釋是可以在網頁文件或文件的特定部分新增的外部備註。它們可以是評論、筆記、解釋或其他型別的備註。由於它們是外部的，因此任何網頁文件都可以獨立地進行註釋，而無需更改實際文件。
讓我們深入瞭解文章，學習 HTML5 中的注音。
HTML5 中的注音（Ruby Annotation）
HTML 元素 <ruby> 表示顯示在主體文字上方、下方或旁邊的簡短註釋，通常用於演示如何發音東亞字元。雖然其他型別的文字也可以使用它進行註釋，但這種應用不太常見。
為了為單詞和短語生成註釋或發音說明，<ruby> 元素與 <rt> 元素結合使用。包含在 <rt> 標籤中的註釋將顯示為主體文字上方的較小文字，主體文字應包含在 <ruby> 標籤中。
對於不支援此樣式的瀏覽器，可以使用可選的 <rp> 元素將括號包裹在注音內容周圍，以指示注音的存在。下表列出了此標籤的版本歷史和使用上下文。
語法
以下是 <ruby> 的語法。
<ruby attributes> Contents... </ruby>
讓我們看看以下示例，以瞭解更多關於如何在 HTML5 中顯示注音的資訊。
示例
考慮以下情況，其中 <ruby> 標籤顯示操作。
<!DOCTYPE html>
<html>
<head>
<style>
body{
text-align: center;
}
rt{ font-size: 10px;
color: red;
}
</style>
</head>
<body>
<p>Telugu Language Annotation</p>
<ruby>
పెద్ద అన్నయ్య<rt>Big Brother</rt>
</ruby>
<p>Normal Annotation Representation</p>
<ruby>
2022<rp>(</rp><rt>Year</rt><rp>)</rp>
12<rp>(</rp><rt> Month</rt><rp>)</rp>
06<rp>(</rp><rt>Date</rt><rp>)</rp>
</ruby>
</body>
</html>
輸出
當指令碼執行時，它將生成一個輸出，其中包含一段使用 <ruby> 標籤顯示的東亞語言註釋和普通註釋表示的文字。
示例
讓我們再考慮一個 <ruby> 標籤用法的示例。
<!DOCTYPE html>
<html>
<head>
<title>ruby tag</title>
</head>
<body>
<ruby>
వర్మ <rp>(</rp><rt>Varma</rt><rp>)</rp>
</ruby>
</body>
</html>
輸出
執行上述指令碼後，它將生成一個輸出，其中包含在上述指令碼中提到的使用 <ruby> 標籤的文字。
示例
您可以嘗試執行以下程式碼來顯示文字注音：
<!DOCTYPE html>
<html>
<head>
<title>HTML Rt Tag</title>
</head>
<body>
<ruby>
అసతోమా <rp>(</rp><rt>Asatooma</rt><rp>)</rp>
సద్గమయ <rp>(</rp><rt>Sadgamaya</rt><rp>)</rp>
</ruby>
</body>
</html>
輸出
當指令碼執行時，它將生成一個輸出，其中包含在上述指令碼中提到的使用 <ruby> 標籤的文字。
更新於： 2023年10月11日
387 次瀏覽
廣告