Foros del Web » Creando para Internet » CSS »

Diferencia entre atributo class y atributo id

Estas en el tema de Diferencia entre atributo class y atributo id en el foro de CSS en Foros del Web. Qué diferencia habría entre hacer esto: Código HTML: Regla CSS: H1.rojo { color: red } etiqueta HTML: <H1 class= "rojo" > Encabezado rojo </H1> y ...
  #1 (permalink)  
Antiguo 08/02/2006, 16:07
 
Fecha de Ingreso: mayo-2003
Mensajes: 527
Antigüedad: 20 años, 10 meses
Puntos: 3
Diferencia entre atributo class y atributo id

Qué diferencia habría entre hacer esto:

Código HTML:
Regla CSS:

H1.rojo { color: red }

etiqueta HTML:

<H1 class="rojo">Encabezado rojo</H1> 
y esto:

Código HTML:
Regla CSS:

H1#rojo { color: red }

etiqueta HTML:

<H1 id="rojo">Encabezado rojo</H1> 

En principio, parece que ambos hacen lo mismo no?
  #2 (permalink)  
Antiguo 08/02/2006, 16:12
Avatar de Hereje  
Fecha de Ingreso: junio-2002
Ubicación: Córdoba, Argentina
Mensajes: 439
Antigüedad: 21 años, 9 meses
Puntos: 2
Si, hacen lo mismo, peeeeero: con una clase podrás establecer un mismo estilo a vaaarios elementos con la misma clase, en cambio, con el id, sólo a uno y sólo un elemento!

Saludos!
__________________
Sergio
  #3 (permalink)  
Antiguo 08/02/2006, 18:45
 
Fecha de Ingreso: mayo-2003
Mensajes: 527
Antigüedad: 20 años, 10 meses
Puntos: 3
Te refieres a que esto estaría bien:

<ELEMENTO1 class="rojo">Elemento1 clase rojo</ELEMENTO1>
<ELEMENTO2 class="rojo">Elemento2 misma clase que arriba</ELEMENTO2>

y esto mal?:

<ELEMENTO1 id="rojo">Elemento1 ID rojo</ELEMENTO1>
<ELEMENTO2 id="rojo">Elemento2 mismo ID que arriba</ELEMENTO2>
  #4 (permalink)  
Antiguo 08/02/2006, 18:50
Avatar de Hereje  
Fecha de Ingreso: junio-2002
Ubicación: Córdoba, Argentina
Mensajes: 439
Antigüedad: 21 años, 9 meses
Puntos: 2
Exacto!

Las clases para "cosas" que se repiten, los id para "cosas" específicas, por ejemplo:
Código:
<html>
  <head>...</head>
  <body>
      <div id="encabezado>
         ...
      </div>
      <div id="contenido">
         <div class="noticia">
            <h1>Titulo</h1>
         </div>
         <div class="noticia">
            <h1>Otro titulo</h1>
         </div>
      </div>
  </body>
</html>
__________________
Sergio
  #5 (permalink)  
Antiguo 08/02/2006, 19:17
 
Fecha de Ingreso: mayo-2003
Mensajes: 527
Antigüedad: 20 años, 10 meses
Puntos: 3
Aaaaah! Ya lo veo más claro que el agua de mayo.

Muchas gracias Hereje!

Por cierto, podrías ayudarme en otro post que he puesto sobre unos ejercicios que no me salen? Son sencillitos y los CSS están sacados de un manual (el HTML lo he hecho yo), por eso me sorprenden que no me salgan.

Este es el link:

http://www.forosdelweb.com/f53/no-salen-estos-sencillos-ejercicios-369763/

gracias de nuevo!
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 06:21.