HTML Ruby 注解后备方案

HTMLHTMLBeginner
立即练习

💡 本教程由 AI 辅助翻译自英文原版。如需查看原文,您可以 切换至英文原版

介绍

在本实验中,你将学习 HTML 的 <rp> 标签。你将了解它的用途、语法和基本示例。<rp> 标签用于为不支持 <ruby> 标签的浏览器提供后备括号。

注意:你可以在 index.html 中练习编码,并学习如何在 Visual Studio Code 中编写 HTML。请点击右下角的 'Go Live' 以在端口 8080 上运行 Web 服务。然后,你可以刷新 Web 8080 标签以预览网页。


Skills Graph

%%%%{init: {'theme':'neutral'}}%%%% flowchart RL html(("HTML")) -.-> html/BasicStructureGroup(["Basic Structure"]) html(("HTML")) -.-> html/TextContentandFormattingGroup(["Text Content and Formatting"]) html(("HTML")) -.-> html/LayoutandSectioningGroup(["Layout and Sectioning"]) html(("HTML")) -.-> html/AdvancedElementsGroup(["Advanced Elements"]) html/BasicStructureGroup -.-> html/basic_elems("Basic Elements") html/TextContentandFormattingGroup -.-> html/text_head("Text and Headings") html/TextContentandFormattingGroup -.-> html/para_br("Paragraphs and Line Breaks") html/TextContentandFormattingGroup -.-> html/text_dir("Text Direction") html/LayoutandSectioningGroup -.-> html/doc_flow("Document Flow Understanding") html/AdvancedElementsGroup -.-> html/inter_elems("Interactive and Dynamic Elements") html/AdvancedElementsGroup -.-> html/custom_attr("Custom Data Attributes") subgraph Lab Skills html/basic_elems -.-> lab-70821{{"HTML Ruby 注解后备方案"}} html/text_head -.-> lab-70821{{"HTML Ruby 注解后备方案"}} html/para_br -.-> lab-70821{{"HTML Ruby 注解后备方案"}} html/text_dir -.-> lab-70821{{"HTML Ruby 注解后备方案"}} html/doc_flow -.-> lab-70821{{"HTML Ruby 注解后备方案"}} html/inter_elems -.-> lab-70821{{"HTML Ruby 注解后备方案"}} html/custom_attr -.-> lab-70821{{"HTML Ruby 注解后备方案"}} end

设置 HTML 文件

  1. 创建一个名为 index.html 的 HTML 文件。
  2. 在 body 中,编写以下 HTML 代码:
<h1>HTML Ruby 括号</h1>
<p>示例文本。</p>

添加 <rp> 标签

  1. <p> 标签下方添加 <ruby> 标签。
  2. <ruby> 标签内,添加带有开闭标签的 <rp> 标签。
<ruby>
  <rp>(</rp>
  <rt>MTV</rt>
  <rp>)</rp>
</ruby>

添加全局事件

  1. 在你的代码中添加任何事件或全局属性,例如内联样式。
<ruby style="font-size: 18px;">
  <rp>(</rp>
  <rt>MTV</rt>
  <rp>)</rp>
</ruby>
  1. 在浏览器中打开 index.html 文件以查看你的代码。

总结

在本实验中,你学习了如何使用 HTML 的 <rp> 标签及其语法。你还学习了如何创建一个基本示例,为不支持 <ruby> 标签的浏览器显示后备括号。<rp> 标签在 HTML 中非常重要,因为它允许格式在不同类型的浏览器中正确显示。