atributo-id-css

El atributo “id” es similar a class (Permite llamar desde un elemento a un código CSS) con la diferencia de que el atributo id solo puede aplicarse a un elemento, no a tantos como quisiéramos, como se hacía con el atributo class.

Es decir, el atributo ID sirve para identificar un elemento, y solo debe usarse para identificar un único elemento, si queremos que pertenezcan a varios elementos entonces debemos usar las clases. Se podría decir que las clases son para grupos. Con el atributo ID también se puede dirigir al visitante a un punto de la página (texto).

Un uso incorrecto de las clases sería definir las clases para un único elemento, porque se puede utilizar #ID para este propósito. Por ejemplo, cuando debemos identificar una única cabecera (class=”header”).

Un uso incorrecto de los #ID´s es definir los estilos de cada elemento de forma individual en lugar de agrupar todos los estilos que sean comunes y aplicarlos por clases.

Un ejemplo con el atributo id sería este:

<div id="elegante">
Soy un simple texto en un div.
</div>

El código CSS para efectuar el estilo del id sería este:

#elegante{

width: 90%;
padding: 10px;
border: 2px dashed #CCC;
background: white;

}

¡ATENCIÓN! Si te fijas, hemos puesto una almohadilla (#elegante) en vez de un punto (.elegante) como hacíamos con el atributo class, esta es otra de las diferencias respecto al otro atributo.