Saltar al contenido

Etiqueta HTML <rtc>

El elemento HTML <rtc> se utiliza para agrupar uno o más <rt> elementos con el fin de proporcionar anotaciones semánticas al texto base ruby. Se encuentra dentro de un contenedor <ruby> junto a elementos <rb>.

Las anotaciones ruby suelen utilizarse en la tipografía del este de Asia. Mientras que los elementos <rt> suelen proporcionar guías de pronunciación, los elementos <rtc> agrupan estas anotaciones para añadir significado semántico (como traducciones o lecturas alternativas) sin afectar la disposición fonética.

Nota: Los elementos <rtc> y <rbc> están obsoletos en HTML5.1+ y han sido eliminados del Estándar Vivo de HTML. Se conservan únicamente por compatibilidad con versiones anteriores. Para el desarrollo web moderno, utilice las propiedades CSS ruby en su lugar.

La etiqueta <rtc> es uno de los elementos HTML5.

Sintaxis

La etiqueta <rtc> viene en pares. El contenido se escribe entre las etiquetas de apertura (<rtc>) y cierre (</rtc>). La etiqueta de cierre del elemento <rtc> puede omitirse cuando está seguida inmediatamente por <rb>, <rt>, <rp> o <rtc>, o cuando no hay ningún contenido en el elemento padre.

Ejemplo de la etiqueta HTML <rtc>:

Advertencia: Este ejemplo utiliza los elementos obsoletos <rtc> y <rbc>. Se proporciona únicamente como referencia para sistemas heredados.

html
<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
  </head>
  <body>
    <ruby>
      <rbc>
        <rb>旧</rb>
        <rt>jiù</rt>
        <rb>金</rb>
        <rt>jīn</rt>
        <rb>山</rb>
        <rt>shān</rt>
      </rbc>
      <rtc><rt>San Francisco</rt></rtc>
    </ruby>
  </body>
</html>

Resultado

HTMLrtc tag example

La etiqueta <rtc> admite los Atributos Globales y los Atributos de Eventos.

Compatibilidad con navegadores

NavegadorCompatibilidad
ChromeLegado
FirefoxLegado
SafariLegado
EdgeLegado
OperaLegado

Nota: La compatibilidad es legada debido a la obsolescencia de <rtc> y <rbc> en HTML5.1+. Los navegadores modernos pueden ignorar estos elementos o representarlos de forma inconsistente. Utilice las propiedades CSS ruby para proyectos actuales.

Práctica

@media (min-width: 962px) { .responsive-image{ width: 420px;}}

¿Te resulta útil?

Vista previa dual-run — compárala con las rutas Symfony en producción.