Diferencia entre atributo class y atributo id

Tigervlc · #1 (**permalink**) 08/02/2006, 16:07

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?

Hereje · #2 (**permalink**) 08/02/2006, 16:12

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!

Tigervlc · #3 (**permalink**) 08/02/2006, 18:45

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>

Hereje · #4 (**permalink**) 08/02/2006, 18:50

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>

Tigervlc · #5 (**permalink**) 08/02/2006, 19:17

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!