Etiqueta de abreviatura HTML

Introducción

La etiqueta HTML <abbr> se utiliza para definir una abreviatura o un acrónimo.

En este laboratorio, aprenderá a usar la etiqueta HTML <abbr> para indicar qué abreviaturas y acrónimos aparecen en el texto de su página web.

Nota: Puede practicar la codificación en index.html y aprender Cómo escribir HTML en Visual Studio Code. Haga clic en 'Go Live' en la esquina inferior derecha para ejecutar el servicio web en el puerto 8080. Luego, puede actualizar la pestaña Web 8080 para previsualizar la página web.

Agrega el título

En primer lugar, cree un documento HTML denominado index.html y declare el tipo de documento.

Agregue el título al archivo index.html.

    <h1>Creating Abbreviations in HTML</h1>

Agrega contenido

Agregue algún contenido de texto al archivo HTML.

    <p>Suppose we have an abbreviation like Mr. or Mrs. which are very common in our day to day life or we can have technical abbreviations like HTML, CSS or HTTP.</p>

Usa la etiqueta

Utilice la etiqueta <abbr> para definir la abreviatura e incluya el atributo title para proporcionar una explicación completa de la abreviatura.

    <p>Suppose we have an abbreviation like <abbr title="Mister">Mr.</abbr> or <abbr title="Misses">Mrs.</abbr> which are very common in our day to day life or we can have technical abbreviations like <abbr title="HyperText Markup Language">HTML</abbr>, <abbr title="Cascading Style Sheets">CSS</abbr> or <abbr title="Hypertext Transfer Protocol">HTTP</abbr>.</p>

Agrega estilos a la etiqueta

Agregue estilos a la etiqueta <abbr> para cambiar la forma en que se muestra la abreviatura en la página web. Por ejemplo, podemos agregar un subrayado discontinuo para indicar una abreviatura.

    <style>
        abbr {
            text-decoration: underline dotted;
        }
    </style>

Guarde su archivo y abrálo en un navegador web para ver el resultado.

Resumen

En este laboratorio, has aprendido cómo crear abreviaturas y siglas en páginas web utilizando la etiqueta HTML <abbr>. También has aprendido cómo agregar estilos a etiquetas <abbr> individuales y aplicar estilos a múltiples etiquetas utilizando el atributo global class.