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 CSSrubyen 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.
<!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

La etiqueta <rtc> admite los Atributos Globales y los Atributos de Eventos.
Compatibilidad con navegadores
| Navegador | Compatibilidad |
|---|---|
| Chrome | Legado |
| Firefox | Legado |
| Safari | Legado |
| Edge | Legado |
| Opera | Legado |
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 CSSrubypara proyectos actuales.
Práctica
@media (min-width: 962px) { .responsive-image{ width: 420px;}}