Thẻ Ruby trong mã html

Question

Sự miêu tả

Thẻ HTML chỉ định các chú thích ruby dành cho cách phát âm của các ký tự Đông Á

Nội dung chính Show

Sự miêu tả
Thuộc tính toàn cầu
Thuộc tính sự kiện
Hỗ trợ trình duyệt
Styling elements
vị trí ruby
hợp nhất ruby
HTML Tag Attributes
Thẻ HTML RT
Thẻ HTML RP
Làm cách nào để đưa ruby vào HTML?
Thẻ ruby trong HTML là gì?
RB trong HTML là gì?
Hiển thị ruby trong CSS là gì?

Thí dụ



   
      HTML Ruby Tag
   

   
      
         æ˜Žæ—¥ (This is it)

Điều này sẽ tạo ra kết quả sau -

Thuộc tính toàn cầu

Thẻ này hỗ trợ tất cả các thuộc tính chung được mô tả trong - Tham khảo thuộc tính HTML

Thuộc tính sự kiện

Thẻ này hỗ trợ tất cả các thuộc tính sự kiện được mô tả trong - Tham khảo sự kiện HTML

Hỗ trợ trình duyệt

ChromeFirefoxIEOperaSafariAndroidYesNot SupportedYesNot SupportedYesYes

Kiếm thu nhập với kỹ năng HTML của bạn

Đăng ký và chúng tôi sẽ gửi cho bạn những cơ hội làm việc tự do tốt nhất ngay trong hộp thư đến của bạn
Chúng tôi đang xây dựng thị trường làm việc tự do tự phục vụ lớn nhất cho những người như bạn

Thẻ xác định chú thích ruby. Nó được sử dụng trong các ngôn ngữ Nhật Bản và Đông Á. Chú thích ruby là một văn bản nhỏ bổ sung được liên kết với văn bản chính để chỉ ra ý nghĩa hoặc cách phát âm của các ký tự tương đương. Chú thích văn bản cơ bản được đặt trong thẻ. Nó được hiển thị trong một bản in nhỏ phía trên chữ tượng hình

Thẻ là một trong những phần tử HTML5

Bạn có thể sử dụng thẻ với và/hoặc thẻ. Thẻ gồm một hoặc nhiều ký tự cần phát âm hoặc giải thích. Thẻ cung cấp thông tin đó và thẻ xác định văn bản thay thế, được hiển thị trong trình duyệt không hỗ trợ thẻ

Thẻ Ruby trong HTML

Thẻ HTML

The tag contains one or more elements that help in pronouncing ruby annotations and appears above the annotation icons. In addition, there might be an (optional) element used as a backup parenthesis for a browser that does not work with the ruby annotation.

An HTML tag can also be used to indicate a small annotation related to the main topic, other than the East Asian language.

The tag is newly introduced in HTML5

cú pháp

<ruby>......</ruby>

Below are some of the specifications relating to the HTML tag

Hiển thị nội dòng
Thẻ bắt đầu/thẻ kết thúc – Cả thẻ bắt đầu và thẻ kết thúc
Cách sử dụng – định dạng

Using

Như được định nghĩa trong đặc tả HTML, có một số phần tử Ruby. Bảng sau đây cho biết chức năng của từng phần tử này

Tạo mối quan hệ giữa văn bản cơ sở và văn bản Ruby. Cũng đóng vai trò là vùng chứa cho tất cả các phần tử Ruby có liên kết
Điều này có nghĩa là phần tử vùng chứa cơ sở Ruby. Nó chứa các phần tử rb khi sử dụng ruby phức tạp trong trường hợp sử dụng HTML. Một phần tử rbc duy nhất sẽ hiển thị trong một phần tử Ruby
Đây là phần tử của cơ sở ruby và đánh dấu cho văn bản cơ sở. Nhiều phần tử rb có thể xuất hiện trong một phần tử rbc. Có một phần tử rt tương ứng cho mỗi phần tử rb
Phần tử chứa văn bản Ruby. Được sử dụng để chứa các phần tử rt trong trường hợp sử dụng đánh dấu Ruby phức tạp. Phần tử ruby có thể chứa tối đa 2 phần tử rtc
Thành phần văn bản Ruby. Được sử dụng như một đánh dấu cho văn bản Ruby. Chúng có thể là các mục trong dòng; . Nó có thuộc tính rbspan để đánh dấu ruby phức tạp, làm cho phần tử rt chứa một số phần tử rb
nghĩa là phần tử dấu ngoặc đơn ruby và một giải pháp thay thế cho tác nhân người dùng không hỗ trợ Ruby phân biệt giữa văn bản Ruby và văn bản cơ sở

Styling elements

Trong Ruby, có ba thuộc tính định dạng;

vị trí ruby

This property is only applicable to containers with and elements and controls the Ruby text position relative to its base.

Trên - Cung cấp văn bản ruby trên cơ sở và bên phải của cơ sở cho Văn bản ngang và văn bản dọc tương ứng. Đây là mặc định
Dưới - Cung cấp văn bản ruby dưới đế và bên trái của đế cho văn bản ngang và văn bản dọc tương ứng
liên ký tự - Đặt văn bản Ruby ở bên phải của mỗi văn bản theo chiều ngang, tuy nhiên, điều này buộc văn bản Ruby hiển thị theo chiều dọc

hợp nhất ruby

Thuộc tính này xử lý cách các hộp ruby sẽ được hiển thị khi có nhiều hơn một hộp chứa ruby gần nhau. Thuộc tính này thực tế không được triển khai trong bất kỳ trình duyệt nào vì giá trị hoạt động duy nhất là giá trị mặc định và riêng biệt

<ruby>無<rt>む</ruby><ruby>常<rt>じょう</ruby>



<ruby style="ruby-merge:separate"><rb>無<rb>常<rt>む<rt>じょう</ruby>

Hai ví dụ mã trên không khác nhau. Cả hai đều có hộp chú thích trong cùng một cột và trường cơ sở tương ứng nằm trong cùng một cột. Phong cách này được gọi là "mono-ruby. "

Ngoài ra, có một giá trị thu gọn nối tất cả các hộp chú thích trên cùng một dòng và trong cùng một đoạn. Trường nhận xét kết hợp bao gồm các hộp cơ sở tương ứng của nó

<ruby>無常<rt>むじょう</ruby>



<ruby style="ruby-merge:collapse"><rb>無<rb>常<rt>む<rt>じょう</ruby>

Các mã dưới đây cũng không khác nhau. Các hộp chú thích có mặt trong cùng một cột với hộp cơ sở tương ứng của chúng. Phong cách này được gọi là nhóm ruby

Giá trị mặc định quy định kiểu hiển thị cho người dùng dựa trên độ dài của hộp chú thích so với hộp cơ sở

ruby-align

Thuộc tính này xác định sự phân phối của các hộp ruby trừ khi nội dung của chúng điền trực tiếp vào các hộp tương ứng

Bắt đầu - Điều này căn chỉnh nội dung ruby với phần đầu của hộp
Trung tâm – Nội dung tập trung của ruby trong hộp của nó
Không gian – Phân phối đều nội dung ruby trong hộp của nó xung quanh cạnh của nó
Không gian xung quanh - Phân phối đồng đều nội dung ruby trong hộp của nó, nhưng nó không lấp đầy không gian từ đầu đến cuối

Thí dụ

<!DOCTYPE html>



<html>



<head>



<title>HTML ruby tag</title>



<style>



body{



text-align: center;



}



rt{ font-size: 10px;



color: green;



}



</style>



</head>



<body>



<h1>Example of ruby tag</h1>



<p>East Asian Langugae Annotation</p>



<ruby>



大哥<rt>Big Brother</rt>



</ruby>



<p>Noraml Annotaion Representation of Expiry date</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>

HTML Tag Attributes

Không có thuộc tính cụ thể cho phần tử này;

Browsers Supporting HTML Tag

Dưới đây là một số trình duyệt hỗ trợ thuộc tính này

Google Chrome5+
Internet Explorer 5. 5+
Safari 5+
Opera 15+

Thẻ HTML RT

In HTML, the meaning of the tag is ruby text.

Văn bản ruby rất cần thiết trong Ruby Annotation

The text shows that utilizing the tag gives pronunciation and translation to East Asian typography.

được sử dụng liên tục trong thẻ

HTML Tag Syntax and Usage

The tag needs the opening tag and closing tag. Below is the syntax of the tag:

<ruby>



<rt>



Upstack



</rt>



</ruby>



Basic Example of <rt>



<!doctype html>



<head>



<style>



ruby {



font-size: 2em;



}



</style>



</head>



<body>



<h1> rt tag example</h1>



<ruby>



? <rp>(</rp><rt>kan</rt><rp>)</rp>



? <rp>(</rp><rt>ji</rt><rp>)</rp>



</ruby>



</body>



</html>

Thẻ HTML RP

In HTML, is utilized as an alternative parenthesis for browsers not compatible with the tag.

Một số trình duyệt không tương thích với thẻ. Do đó, để hiển thị văn bản đính kèm bằng cách sử dụng thẻ trong các trình duyệt đó, yêu cầu sử dụng trong HTML5

Làm cách nào để đưa ruby vào HTML?

Sử dụng . Phần tử

Thẻ ruby trong HTML là gì?

The HTML element represents small annotations that are rendered above, below, or next to base text, usually used for showing the pronunciation of East Asian characters. It can also be used for annotating other kinds of text, but this usage is less common.

RB trong HTML là gì?

Phần tử HTML dùng để phân định thành phần văn bản cơ sở của chú thích , tôi. e. văn bản đang được chú thích. Một phần tử

Hiển thị ruby trong CSS là gì?

Bố cục CSS Ruby là một mô-đun CSS cung cấp mô hình kết xuất và các điều khiển định dạng liên quan đến việc hiển thị chú thích ruby . Chú thích Ruby là một dạng chú thích xen kẽ, bao gồm các dòng văn bản ngắn bên cạnh văn bản cơ sở.

programming html