首页 > 文章列表 > HTML中Ruby标签间出现间隔如何解决?

HTML中Ruby标签间出现间隔如何解决?

465 2025-01-17

HTML中Ruby标签间出现间隔如何解决?

HTML中的Ruby标签之间的间隔问题?

当使用<u>标签将两个<ruby>标签包裹起来时,可能会出现中间出现间隔的问题。这是因为浏览器的实现方式导致的。

解决方法:

考虑直接使用border-bottom属性替代<u>标签。

<div>
  <ruby>
    <rb>源</rb>
    <rp>(</rp>
    <rt>みなもの</rt>
    <rp>)</rp>
  </ruby>
  <ruby>
    <rb>義経</rb>
    <rp>(</rp>
    <rt>よしつね</rt>
    <rp>)</rp>
  </ruby>
</div>

另一种方法是修改<ruby>标签,如下所示:

<div>
  <u style="font-size: 0;">
    <ruby>
      <rb>源</rb>
      <rp>(</rp>
      <rt>みなもの</rt>
      <rp>)</rp>
    </ruby>
    <ruby>
      <rb>義経</rb>
      <rp>(</rp>
      <rt>よしつね</rt>
      <rp>)</rp>
    </ruby>
  </u>
</div>
来源:1731315520