DesarrolloLibre

Desarrollo Web, Android, juegos y mucho más

Categorias
19-11-2015

En la API de HTML existen muchas tags o elementos muy poco usados por tener funciones muy específicas y por lo tanto no son tan famosos pero que son iguales útiles; hoy veremos un par de tags HTML que puede que no conozcas:

El elemento <base>

Este elemento define una URL y/o target global al documento que permite sobrescribir los atributos target y/o href que no se encuentren especificados en un elemento <a>.

¡IMPORTANTE! solo puede haber un elemento <base> en el head del documento:

Si tenemos el siguiente código HTML:

    <html>
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
            <title>Elemento base 1</title>
            <base href="https://www.bing.com/" target="_blank">
        </head>

        <body>
            <a href="">Google.com</a>
        </body>
    </html>

Veremos que al precionar sobre el enlace "Google.com" esta nos redirigirá al buscador de Microsoft en la siguiente dirección: https://www.bing.com/.

Ver ejemplo

Si por el contrario, si especificamos la URL en el atributo href del enlace:

    <html>
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
            <title>Elemento base 2</title>
            <base href="https://www.bing.com/" target="_blank">
        </head>

        <body>
            <a href="http://www.google.com/">Google.com</a>
        </body>
    </html>

El enlace nos redirigirá a Google.com aunque al no especificar el target se abrirá el enlace en una pestaña nueva.

Ver ejemplo

El elemento <abbr>

Este elemento simplemente permite definir una abreviación como podemos ver en el siguiente ejemplo:

    <p>El lenguaje de programación <abbr title="PHP Hypertext Pre-processor">PHP</abbr>...</p>
El lenguaje de programación PHP...

coloca el cursor encima de la palabra PHP.

Consulta la documentación oficial en los siguientes enlaces:


Publicidad

Give me for a beer!

Algunos recursos que te pueden interesar

Animacion SVG sencilla con solo HTML

Animacion SVG sencilla con solo HTML

Animación Torus solo con HTML y CSS

Animación Torus solo con HTML y CSS

Modelo de tarjetas con CSS

Modelo de tarjetas con CSS

Algunos artículos que te pueden interesar

Aplicando los Media Queries en los vídeos con HTML5

Aplicando los Media Queries en los vídeos con HTML5

Los Media Queries para vídeos son aplicables mediante el atributo media en el fuente (source) y de esta forma cargar vídeos según las especificaciones de cada dispositivo.

Andrés Cruz 28-09-2015

¿Cómo crear un checkbox personalizado en CSS?

¿Cómo crear un checkbox personalizado en CSS?

En esta entrada veremos cómo crear un checkbox custom o personalizados con solo CSS, con esto se quiere decir que no se emplea la renderización realizada por defecto por los navegadores.

Andrés Cruz 09-07-2015

Nuevos campos de formularios en HTML5 (Guía rápida)

Nuevos campos de formularios en HTML5 (Guía rápida)

En este artículo trataré de mostrarles los nuevos campos que nos trae el HTML5; como veremos son muchos "type" específicos para cada tipo de campo; pasando por varios formatos de fechas hasta llegar a otros como email, url, rangos entre otros.

Andrés Cruz 18-07-2013