ID vs CLASS

ID Vs Class

Me gustaría hablaros hoy de unas propiedades que marcarán la diferencia cuando tengamos que hacer código repetitivo y rutinario. Hoy hablaremos de ID vs CLASS que son dos modos de identificar los elementos de una web y sus propiedades.

¿Cómo lo usaremos?

Básicamente existe una diferencia única entre ID (nombre) y Class (clase).

ID se puede utilizar tan solo una única vez a lo largo de todo el código fuente, lo cual nos puede resultar muy útil para vincular acciones a un DIV especifico u otro elemento pero por lo general yo recomiendo usar CLASS sobre todo si no tenemos una gran experiencia en programación web ya que nos veremos obligados a cambiar muchas veces parte del código y en ocasiones duplicar las propiedades de los elementos.

En CLASS no existe restricción sobre el número de veces que podemos usarlo.

Para que lo entendamos más facilmente, pondremos un ejemplo de la vida real.

Un coche tiene una matrícula (ID) que lo identifica inequívocamente entre todos los demás vehículos. Si en vez de guiarnos por matriculas queremos aplicar características a grupos usaremos la clase (CLASS) por ejemplo: Todos los vehículos fabricados en el año 1940 son coches clásicos, eso quiere decir que en todo un grupo se aplica una norma o propiedad.

Veamos el código fuente

HTML

ID

 <(tag) id="nombre del ID"></(tag)> 

Ejemplo práctico
<div id=”unico”></div>

 <div id="unico"></div> 

CLASS

 <(tag) class="Nombre de Class"></(tag)> 

Ejemplo práctico

 <div class="varios"></div> 

 

Información
Aunque podamos usar el mismo nombre en CLASS y en ID no es una buena idea. Es una mala práctica que pagaremos cara cuando pretendamos actualizar el código en el futuro.

 

CSS

ID

 #(nombreID) {} 

Ejemplo práctico

 #unico {} 

 

CLASS

.(nombreclass) {}

Ejemplo práctico

.varios {}

 

¡Si te gusto o tienes dudas mándame un tweet!