Is it possible to place ruby fonts on the bottom?

user_645244 0
Viewed 136

Using CSS would I be able to move the line in the tags to the bottom of the word instead of the top of the word?

<!DOCTYPE html>
<html>
  <head>
    <style>
      rt {
        line-height: Normal;
        font-size: .4em;
        text-align: center;
      }
    </style>
  </head>
  <body>

  <ruby>
  中文 <rt>Zhōngwén</rt>
  </ruby>

  </body>
</html>
css
1 Answers

I would wrap your Zhōngwén in <rb></rb> and make it the base of the ruby container. Then have the 中文 wrapped in the <rt></rt> tags and style each. Take a look at what I did here:

<!DOCTYPE html>
<html>
  <head>
    <style>
      rb {
        line-height: Normal;
        font-size: .4em;
        text-align: center;
      }
      rt{
        font-size: 16px;
      }
    </style>
  </head>
  <body>

  <ruby>
  <rb>Zhōngwén</rb> <rt>中文</rt>
  </ruby>

user_111111190
Related