Saltar al contenido

¿Superíndice solo en CSS?

Solución:

Puedes hacer superíndice con vertical-align: super, (más un acompañante font-size reducción).

Sin embargo, asegúrese de lee las otras respuestas aquí, en particular los de paulmurray y cletus, para obtener información útil.

Honestamente, no veo el sentido de hacer superíndice / subíndice solo en CSS. No hay un atributo CSS útil para ello, solo un montón de implementaciones de cosecha propia que incluyen:

.superscript { position: relative; top: -0.5em; font-size: 80%; }

o usando alineación vertical o estoy seguro de otras formas. La cosa es que empieza a complicarse:

  • Espaciado de superíndice CSS en la altura de la línea;
  • Tenga cuidado con CSS para superíndice / subíndice sobre por qué posiblemente no debería aplicar estilo a superíndice / subíndice con CSS en absoluto;

Vale la pena enfatizar el segundo punto. Normalmente, el superíndice / subíndice no es en realidad un problema de estilo, pero es indicativo de significado.

Nota al margen: Vale la pena mencionar esta lista de entidades para expresiones matemáticas comunes de superíndice y subíndice, aunque esta pregunta no se relaciona con eso.

Las etiquetas sub / sup están en HTML y XHTML. Solo usaría esos.

En cuanto al resto de su CSS, el pseudoelemento y los atributos de contenido: after no son ampliamente compatibles. Si realmente no desea poner esto manualmente en el HTML, creo que una solución basada en Javascript es su próxima mejor opción. Con jQuery esto es tan simple como:

$(function() {
  $("a.external").append("<sup>+</sup>");
};

La documentación de CSS contiene el equivalente de CSS estándar de la industria para todas las construcciones HTML. Es decir: la mayoría de los navegadores web en estos días no manejan explícitamente SUB, SUP, B, I y así sucesivamente, ellos (un poco más o menos) se convierten en SPAN elementos con propiedades CSS apropiadas, y el motor de renderizado solo se ocupa de eso.

La página es el Apéndice D. Hoja de estilo predeterminada para HTML 4

Los bits que desea son:

small, sub, sup { font-size: .83em }
sub             { vertical-align: sub }
sup             { vertical-align: super }
¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)


Tags : /

Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *