Registrarse | Iniciar Sesión

Mozilla.com

  1. MDC
  2. Portada
  3. HTML
  4. Elemento
  5. a
Tabla de contenidos
  1. 1. Definición
    1. 1.1. Atributos
  2. 2. Ejemplos de uso
    1. 2.1. Ancla y enlace
    2. 2.2. Un enlace simple
    3. 2.3. Un enlace informativo
    4. 2.4. Origen y destino
  3. 3. Soporte
  4. 4. Notas
Redirigido desde Es/HTML:Elemento:a

a

Definición

a de anchor=ancla.

Es uno de los elementos más importantes del HTML. Es el encargado de crear los típicos vínculos hipertextuales. Puede actuar como origen y como destino de estos enlaces. Además son muy apreciadas sus capacidas dinámicas.

Sus etiquetas son: <a> y </a> (ambas obligatorias).
Crea una caja: en línea.
Está definido como: Elemento en línea y elemento especial.
Puede contener: cero o más elementos en línea, pero no puede contener elementos a.

Atributos

atributo descripción valor por omisión
Genéricos
title Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip". Texto legible. Sensible a M/m.. Lo fija el navegador.
id Le da un nombre al elemento que lo diferencia de todos los demás del documento. Un nombre único. Sensible a M/m. Lo fija el navegador.
class Asigna nombres de clases al elemento. Por defecto, clases CSS. Lista de clases separadas por espacio en blanco. Sensible a M/m. cdata Lo fija el navegador.
style Permite especificar información de estilo. Por defecto, estilos CSS. Declaraciones de estilo. Lo fija el navegador.
lang Información sobre el idioma del contenido del elemento y del valor de sus atributos. Un código de idioma. Lo fija el navegador. PD.: "desconocido".
dir Indica la dirección de texto y tablas. Uno de los siguientes: 'ltr' o 'rtl'. Lo fija el navegador. PD.: En castellano 'ltr'.
Eventos: onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.
atributo descripción valor por omisión
Específicos
name Le pone nombre al elemento para poder usarlo como destino de un vínculo. Un nombre. Sensible a M/m. Lo fija el navegador.
href La dirección del recurso vínculado. Una dirección URI. Sensible a M/m. (o no). Lo fija el navegador.
hreflang Indica el idioma del recurso vínculado. Un código de idioma. Lo fija el navegador.
charset La codificación de caracteres del recurso enlazado. Una codificación de caracteres. Lo fija el navegador.
type Tipo de contenido consultivo del recurso vinculado. Un tipo de contenido MIME. Lo fija el navegador.
rel Define un vínculo directo. Informa sobre el recurso vínculado y su relación con el documento actual. Lista de tipos de vínculo separados por espacios. Lo fija el navegador.
rev Define un vínculo inverso. Es el complemento de rel, pero al revés. Lista de tipos de vínculo separados por espacios. Lo fija el navegador.
accesskey Define una tecla de acceso rápido. Importante para la Accesibilidad. Un carácter o letra. Lo fija el navegador.
tabindex Asigna un número de posición en el orden de tabulación. Un número entre 0 y 32767. Lo fija el navegador.
shape Indica la forma del área del mapa. Para mapas de imágenes en el cliente. Uno de los siguientes: 'rect', 'circle', 'poly', o 'default'. PD.: 'rect'
coords Indica las coordenadas (x,y) del área del mapa. Para mapas de imágenes en el cliente. Lista de: cantidades de píxeles, o porcentajes de espacio disponible. Separadas por comas. Lo fija el navegador.
Eventos: onfocus, onblur.
De transición
target Indica el marco en el que se cargará el recurso. Puede ser el nombre de un marco existente, o un nombre reservado Lo fija el navegador.
atributo descripción valor por omisión

Ejemplos de uso

Ancla y enlace

Un elemento a no es un enlace. 

 <p> Un <a> ancla </a> mínimo. no parece muy distinto de un <span> span </span> </p>

Al ponerle el atributo href se convierte en el origen de un enlace. Si le ponemos el atributo name (o id), se convierte en un marcador que pueda ser el destino de un enlace, y si le ponemos ambos lo tenemos todo.

Un enlace simple

El uso más frecuente de a es como punto de origen de un vínculo. 

 <p> 
 El <a href='http://www.w3.org/MarkUp/'>HTML</a> es la lengua franca de la WWW.  
 </p>

El contenido del elemento actua como origen, a modo de botón, al seleccionarlo solicitamos el recurso indicado en el atributo href .

Un enlace informativo

Puede resultar interesante añadir información suplementaria sobre el recurso vinculado. 

 Visita el <a href='http://www.w3.org/' hreflang='en-US' 
                                        charset='utf-8'> sitio del W3C</a>,
      o su <a href='http://www.w3c.es/' hreflang='es-ES' 
                                        type='application/xhtml+xml'> oficina en España</a>.

hreflang indica el idioma de los contenidos (inglés, francés...), type indica el tipo de contenido (text/html, image/png...), y charset la codificación de caracteres (UTF-8, ISO-8859-1...).

Origen y destino

Hemos visto como con href, a actúa como origen de un vínculo. también puede actuar como destino. aunque para ello tenemos que ponerle nombre. Esto puede hacerse de dos maneras, la antigua con name y la moderna con id. 

 Consulta el estándar para saber más sobre:
 <a href='http://html.conclase.net/w3c/html401-es/struct/links.html'       >vínculos</a>,
 y el 
 <a href='http://html.conclase.net/w3c/html401-es/struct/links.html#edef-A'>elemento a</a>.

El primer vínculo te lleva al inicio de la página de la especificación que explica lo de los enlaces. El segundo nos carga la misma página pero en la sección concreta que habla del elemento a. ¿Cómo es esto posible? Muy sencillo, el código (simplificado) del encabezado de esa sección es: 

 <h2> El elemento <a name="edef-A"> A </a> </h2>

name="edef-A" le pone un nombre al elemento, para llamar a ese elemento basta añadir su nombre, con el prefijo (#) al final del URI. Pero name es un atributo en franca decadencia, lo "moderno" es usar id, ¿Ventajas? Por ejemplo, que cualquier elemento puede ser destino de un vínculo: 

 <h2 id='edef-A'> El elemento A </h2>

== Estilo predeterminado == En principio un ancla no tiene estilo, pero un enlace sí: 

  <p> Un <a> ancla mínimo </a> no se diferencia del resto del párrafo. </p>
  <p> Un <a name=''> ancla con name </a> tampoco parece muy distinto. </p>
  <p> Un <a href=''> ancla con href </a> sí que se diferencia del resto del párrafo. </p>

En Firefox se mostrará con texto azul, subrayado y con un puntero distintivo, en la mayoría de los otros navegadores también (más o menos). El estilo queda de manifiesto en el siguiente ejemplo: 

 <p>   
  Esto es <a href='http://www.w3c.es/'> un enlace </a>. 
  Esto solo <span style='color: blue; 
               text-decoration: underline; 
               cursor: url(), pointer'> lo parece </span>. 
 </p>

Soporte

Sobre el soporte que ofrecen los principales navegadores se puede consultar esta comparativa: IE6 vs IE7 vs FF1.5 vs OP9.

Puede verse que Firefox es el que mejor soporta el elemento a.

Notas

  • En HTML casi todo es insensible a mayúsculas y minúsculas por lo que es fácil olvidarse de que los URI suelen ser sensibles, como lo son los atributos id o name ...


==Referencia==

Estamos ampliando este documento, posiblemente contenga carencias y defectos. ¡Estamos en obras! Disculpen las molestias.

¿Quieres participar en la elaboración de este documento? Para saber cómo hacerlo consulta MDC:Como ayudar.

Page last modified 16:42, 24 Ago 2006 by Jorolo

Tags:

Archivos (0)