Definición destacada
¿Como funciona el comando en HTML5: 'sub'?
Última modificación: 2024-06-18
<sub> en HTML5
Descripción de la Instrucción HTML5 <sub>
El elemento <sub> en HTML5 se utiliza para representar texto en línea que debe aparecer en un formato de subíndice. Un subíndice es un número o letra que se coloca ligeramente por debajo de la línea de texto normal, generalmente en un tamaño más pequeño. Este es comúnmente usado en representaciones matemáticas, químicas y científicas para denotar fórmulas, isotopos o valores específicos.
Atributos de <sub>
En términos de atributos, <sub> no introduce atributos nuevos específicos de este elemento, pero sigue soportando los atributos globales aplicables a todos los elementos HTML5:
- class: Permite especificar una o varias clases CSS para el elemento.
- id: Define un identificador único para el elemento.
- style: Utilizado para aplicar estilos CSS en línea directamente al elemento.
- title: Ofrece información adicional sobre el elemento como un texto emergente.
- lang: Especifica el idioma del contenido del elemento.
- dir: Define la dirección del texto.
- *data- attributes**: Permite el uso de atributos personalizados para almacenar datos adicionales sobre un elemento.
- hidden: Puede utilizarse para ocultar el elemento.
- tabindex: Establece el orden de tabulación del elemento.
- accesskey: Permite definir una tecla de acceso rápido para centrar el enfoque en el elemento.
Uso del <sub> en HTML5
El uso del <sub> es bastante directo. Este elemento se inserta en el cuerpo de un párrafo o cualquier otro contenedor de texto donde se necesita que un fragmento del texto sea rendereado en un formato de subíndice.
Ejemplos sencillos de uso
A continuación, se muestran algunos ejemplos ilustrativos del uso del elemento <sub> en HTML5:
Ejemplo 1: Notación Química
<!DOCTYPE html>
<html>
<head>
<title>Ejemplo de Subíndice</title>
</head>
<body>
<p>La fórmula química del agua es H<sub>2</sub>O.</p>
</body>
</html>En este ejemplo, el <sub> se usa para los "2" en la fórmula del agua, lo cual es una notación común en química para denotar que hay dos átomos de hidrógeno.
Ejemplo 2: Notación Matemática
<!DOCTYPE html>
<html>
<head>
<title>Ejemplo de Subíndice</title>
</head>
<body>
<p>En matemáticas, la suma de los primeros n números enteros es S<sub>n</sub> = n(n+1)/2.</p>
</body>
</html>Aquí, el <sub> se utiliza para denotar la notación en subíndice en una fórmula matemática.
Ejemplo 3: Notación Científica
<!DOCTYPE html>
<html>
<head>
<title>Ejemplo de Subíndice</title>
</head>
<body>
<p>El isótopo de Carbono-14 se representa como C<sub>14</sub>.</p>
</body>
</html>En este caso, el <sub> se utiliza para el "14" en la notación del isótopo del carbono, una notación común en química y física.
Ejemplo 4: Uso de atributos globales
<!DOCTYPE html>
<html>
<head>
<title>Ejemplo de Subíndice con Atributos</title>
</head>
<body>
<p id="demo" class="example" title="Fórmula del sulfato de sodio">
La fórmula del sulfato de sodio es Na<sub>2</sub>SO<sub>4</sub>.
</p>
</body>
</html>En este ejemplo, el elemento <sub> se utiliza con atributos globales (id, class, title) para mejorar la accesibilidad y la aplicabilidad de estilos.
Conclusión
El elemento <sub> es una herramienta esencial en HTML5 para representar subíndices, útiles en diversos campos como la ciencia y las matemáticas. Aunque no tiene atributos específicos por sí mismo, puede utilizar todos los atributos globales disponibles en HTML5, permitiendo una integración rica y versátil con CSS y otros elementos HTML.