Foros del Web » Creando para Internet » CSS »

diferencias con <div id=""> con <div class="">

Estas en el tema de diferencias con <div id=""> con <div class=""> en el foro de CSS en Foros del Web. hola muy buenas, me gustaria saber la diferencia que hay <div id=""> con <div class=""> pues porque he visto muchos ejemplos con <div id=""> y ...
  #1 (permalink)  
Antiguo 22/06/2006, 07:16
Avatar de gachon  
Fecha de Ingreso: septiembre-2004
Ubicación: En Google
Mensajes: 462
Antigüedad: 13 años, 3 meses
Puntos: 3
diferencias con <div id=""> con <div class="">

hola muy buenas,
me gustaria saber la diferencia que hay <div id=""> con <div class=""> pues porque he visto muchos ejemplos con <div id=""> y otros con <div class="">
exite diferencia o es lo mismo?


saludos
  #2 (permalink)  
Antiguo 22/06/2006, 09:00
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.544
Antigüedad: 15 años, 8 meses
Puntos: 1262
Hola:

Los id's se referencian con el prefijo "#" y las clases con "."
Un id debe ser único y una clase puede ser referenciada por muchos elementos, incluso un elemento puede tener 2 clases.

Para aplicar estilos es mejor hacerlo con clases, aunque para casos aislados valen los id's... y además se referencian mejor con javascript.

Saludos
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
  #3 (permalink)  
Antiguo 22/06/2006, 14:15
Avatar de gachon  
Fecha de Ingreso: septiembre-2004
Ubicación: En Google
Mensajes: 462
Antigüedad: 13 años, 3 meses
Puntos: 3
gracias por la aclaracion
  #4 (permalink)  
Antiguo 23/06/2006, 19:35
 
Fecha de Ingreso: octubre-2004
Ubicación: Cork (Irlanda)
Mensajes: 161
Antigüedad: 13 años, 1 mes
Puntos: 1
Hola! Voy a aprovechar este post para exponer una pequeña duda.

Los casos aislados a los que se refiere Caricatos, ¿son estilos que solamente se van a aplicar a un elemento?

Es que tengo un lio... siempre asigno un id a cualquier elemento que se me ocurra meter, y si el estilo que le voy a dar solo lo va a usar ese elemento pues lo defino con # y ya está.

¿Esto es correcto?
¿Sería mejor definir una clase aunque sepamos de antemano que solo la vamos a asignar a un elemento?

Aunque el efecto es el mismo, ¿es más... no sé... práctico o técnico o como queráis llamarlo el hacerlo con clases?
  #5 (permalink)  
Antiguo 23/06/2006, 20:03
Avatar de fer10  
Fecha de Ingreso: octubre-2005
Ubicación: Guadalajara - Mexico
Mensajes: 905
Antigüedad: 12 años, 1 mes
Puntos: 3
Cita:
Hola! Voy a aprovechar este post para exponer una pequeña duda.

Los casos aislados a los que se refiere Caricatos, ¿son estilos que solamente se van a aplicar a un elemento?

Es que tengo un lio... siempre asigno un id a cualquier elemento que se me ocurra meter, y si el estilo que le voy a dar solo lo va a usar ese elemento pues lo defino con # y ya está.

¿Esto es correcto?
¿Sería mejor definir una clase aunque sepamos de antemano que solo la vamos a asignar a un elemento?

Aunque el efecto es el mismo, ¿es más... no sé... práctico o técnico o como queráis llamarlo el hacerlo con clases?
yo creo q ta eso depende de "programador", pero yo en lo personal con id solo divs importantes como head, footer y que solo las uso 1 vez para todo lo demas clases
__________________
Saludos
FT.
www.fernando.com.mx

Última edición por fer10; 27/06/2006 a las 11:13
  #6 (permalink)  
Antiguo 27/06/2006, 07:25
 
Fecha de Ingreso: junio-2005
Ubicación: Madrid, España
Mensajes: 288
Antigüedad: 12 años, 5 meses
Puntos: 1
El id no sirve solo para asignarles estilo al div, sino para identificar un objeto en el documento, todos los elementos tienen id, una tabla, un iframe, etc. Despues mediante DOM podemos hacer referencia a el y tratar sus propiedades.
  #7 (permalink)  
Antiguo 27/06/2006, 09:33
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.544
Antigüedad: 15 años, 8 meses
Puntos: 1262
Cita:
Iniciado por zekenet
El id no sirve solo para asignarles estilo al div, sino para identificar un objeto en el documento, todos los elementos tienen id, una tabla, un iframe, etc. Despues mediante DOM podemos hacer referencia a el y tratar sus propiedades.
Hola:

Los id's deben declararse, y de no hacerse no existe... tal vez te hayas confundido con el atributo uniqueID del explorer... Y hay muchas formas de referenciar un elemento con el DOM... a partir del nodo raiz (document o mejor document.documentElement) los hijos de un nodo se indexan con el array childNodes... Los nodos padre son parentNode... el primer nodo es firstChild, el último lastChild... el siguiente de uno dado nextSibling...

Saludos
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
  #8 (permalink)  
Antiguo 27/06/2006, 10:18
 
Fecha de Ingreso: junio-2005
Ubicación: Madrid, España
Mensajes: 288
Antigüedad: 12 años, 5 meses
Puntos: 1
no me equivoco con uniqueID, me refiero a acceder mediante document.getElementById("id")...... ,para acceder a el tienes que tener identificado el elemento mediante la propiedad id de la etiqueta, ya sea un div, table, input, etc..... Es decir que el id no solo vale para asignarle estilos sino para identificar elementos en nuestro documento. Vamos es la principal diferencia que yo veo entre id y class que es a lo que venia preguntando gachon
Por ejemplo para acceder a un input de un form no tengo que poner document.formulario.nombre_input.value si no que con poner document.getElementById("id_input").value accedo a el valor directamente.
  #9 (permalink)  
Antiguo 29/06/2006, 16:40
 
Fecha de Ingreso: junio-2006
Mensajes: 16
Antigüedad: 11 años, 5 meses
Puntos: 0
HTML/CSS Uso de ID/CLASS (Recomendacion W3C)

Segun la recomendacion W3C para HTML dice lo sgte:

Definiciones de atributos

id = name
Este atributo asigna un nombre a un elemento. Este nombre debe ser único en un documento.

class = lista
Este atributo asigna un nombre de clase o un conjunto de nombres de clase a un elemento. Se puede asignar el mismo nombre o nombres de clase a cualquier número de elementos. Los nombres de clase múltiples deben estar separados por caracteres de espacio en blanco.

El atributo id tiene varios papeles en HTML:

* Como selector para las hojas de estilo.
* Como vínculo destino para vínculos de hipertexto.
* Como medio de hacer referencia a un elemento en particular desde un script.
* Como nombre de un elemento OBJECT declarado.
* Para procesos generales por parte de agentes de usuario (p.ej., para identificar campos cuando se transfieren datos desde páginas HTML hasta una base de datos, para traducir documentos HTML a otros formatos, etc.).


El atributo class, por otra parte, asigna uno o más nombres de clase a un elemento; se puede decir que el elemento pertenece a estas clases. Varios elementos pueden compartir el mismo nombre de clase. El atributo class tiene varios papeles en HTML:

* Como selector para hojas de estilo (cuando un autor desea asignar información de estilo a un conjunto de elementos).
* Para procesos generales por parte de agentes de usuario.


En resumen, para estilos es ideal usar CLASS.
ademas porque permite mezclar clases

<DIV CLASS="negrita centrado conborde"> ... </DIV>


ID deberia usarse para la programacion en JS
se puede acceder al objeto con

document.getElementById('idElemento')




Cita:
Iniciado por gachon
hola muy buenas,
me gustaria saber la diferencia que hay <div id=""> con <div class=""> pues porque he visto muchos ejemplos con <div id=""> y otros con <div class="">
exite diferencia o es lo mismo?

saludos
  #10 (permalink)  
Antiguo 29/06/2006, 18:04
 
Fecha de Ingreso: febrero-2005
Mensajes: 670
Antigüedad: 12 años, 10 meses
Puntos: 0
Cita:
Iniciado por zekenet
no me equivoco con uniqueID, me refiero a acceder mediante document.getElementById("id")...... ,para acceder a el tienes que tener identificado el elemento mediante la propiedad id de la etiqueta, ya sea un div, table, input, etc..... Es decir que el id no solo vale para asignarle estilos sino para identificar elementos en nuestro documento. Vamos es la principal diferencia que yo veo entre id y class que es a lo que venia preguntando gachon
Por ejemplo para acceder a un input de un form no tengo que poner document.formulario.nombre_input.value si no que con poner document.getElementById("id_input").value accedo a el valor directamente.
Creo que caricatos se refería a que no todos los elementos tienen id. Tenés que declararlo para que lo tengan.

Suerte
Fede
__________________
Federico H. García
Desarrollo Web
www.federicog.com.ar
  #11 (permalink)  
Antiguo 29/06/2006, 18:25
Avatar de iconogt  
Fecha de Ingreso: septiembre-2004
Ubicación: Guatemala
Mensajes: 573
Antigüedad: 13 años, 3 meses
Puntos: 4
div, class

Pues si, la explicación mas corta y clara para esa pregunta (debería estar en las faq's, por tantas veces que lo han preguntado), sería que id(#) es sólo para un elemento y class(.) se puede usar en varios elementos dependiendo de la declaración que se haga.

Por ejemplo:
si hacemos una declaración así:

#capa .clase {propiedad:valor;}

Entonces esto quiere decir que la clase sólo tendría que funcionar siempre y cuando esté dentro de el div que lleva por nombre #capa.
__________________
_______
Jorge Rojas.

Última edición por iconogt; 29/06/2006 a las 18:28 Razón: Me faltó agregar algo.
  #12 (permalink)  
Antiguo 13/06/2009, 13:33
 
Fecha de Ingreso: marzo-2008
Ubicación: Patzún, Chimaltenango
Mensajes: 71
Antigüedad: 9 años, 9 meses
Puntos: 0
Exclamación Respuesta: diferencias con <div id=""> con <div class="">

Cita:
Iniciado por caricatos Ver Mensaje
Hola:

Los id's se referencian con el prefijo "#" y las clases con "."
Un id debe ser único y una clase puede ser referenciada por muchos elementos, incluso un elemento puede tener 2 clases.

Para aplicar estilos es mejor hacerlo con clases, aunque para casos aislados valen los id's... y además se referencian mejor con javascript.

Saludos
Me parece que es buena aportacion la tuya solo que una observacion muy severa.

Es totalmente lo contrario...

EN SERIO es ALREVES

fijense esto que encontre en la pagina oficial de www (punto) w3 (punto) org

He aqui...
Código PHP:
Rules for style rule precedences and inheritance depend on the style sheet language.

The following CSS STYLE declaration puts a border around every H1 element in the document and centers it on the page.

<
HEAD>
 <
STYLE type="text/css">
   
H1 {border-width1bordersolidtext-aligncenter}
 </
STYLE>
</
HEAD>

To specify that this style information should only apply to H1 elements of a specific class, we modify it as follows:

<
HEAD>
 <
STYLE type="text/css">
   
H1.myclass {border-width1bordersolidtext-aligncenter}
 </
STYLE>
</
HEAD>
<
BODY>
 <
H1 class="myclass"This H1 is affected by our style </H1>
 <
H1This one is not affected by our style </H1>
</
BODY>

Finallyto limit the scope of the style information to a single instance of H1set the id attribute:

<
HEAD>
 <
STYLE type="text/css">
   
#myid {border-width: 1; border: solid; text-align: center}
 
</STYLE>
</
HEAD>
<
BODY>
 <
H1 class="myclass"This H1 is not affected </H1>
 <
H1 id="myid"This H1 is affected by style </H1>
 <
H1This H1 is not affected </H1>
</
BODY
  #13 (permalink)  
Antiguo 13/06/2009, 13:53
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: diferencias con <div id=""> con <div class="">

Por favor, señores Admin/mod
Han tenido que pasar 3 años
NO BORREN EL TEMA ni lo CIERREN
Que Caricatos pueda responder


Cita:
Iniciado por hwelt Ver Mensaje

Cita:
Iniciado por caricatos
Hola:

Los id's se referencian con el prefijo "#" y las clases con "."
Un id debe ser único y una clase puede ser referenciada por muchos elementos, incluso un elemento puede tener 2 clases.

Para aplicar estilos es mejor hacerlo con clases, aunque para casos aislados valen los id's... y además se referencian mejor con javascript.

Me parece que es buena aportacion la tuya solo que una observacion muy severa.

Es totalmente lo contrario...

EN SERIO es ALREVES

fijense esto que encontre en la pagina oficial de www (punto) w3 (punto) org

He aqui...
Código PHP:
Rules for style rule precedences and inheritance depend on the style sheet language.

The following CSS STYLE declaration puts a border around every H1 element in the document and centers it on the page.

<
HEAD>
 <
STYLE type="text/css">
   
H1 {border-width1bordersolidtext-aligncenter}
 </
STYLE>
</
HEAD>

To specify that this style information should only apply to H1 elements of a specific class, we modify it as follows:

<
HEAD>
 <
STYLE type="text/css">
   
H1.myclass {border-width1bordersolidtext-aligncenter}
 </
STYLE>
</
HEAD>
<
BODY>
 <
H1 class="myclass"This H1 is affected by our style </H1>
 <
H1This one is not affected by our style </H1>
</
BODY>

Finallyto limit the scope of the style information to a single instance of H1set the id attribute:

<
HEAD>
 <
STYLE type="text/css">
   
#myid {border-width: 1; border: solid; text-align: center}
 
</STYLE>
</
HEAD>
<
BODY>
 <
H1 class="myclass"This H1 is not affected </H1>
 <
H1 id="myid"This H1 is affected by style </H1>
 <
H1This H1 is not affected </H1>
</
BODY
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++

Última edición por kseso?; 13/06/2009 a las 14:12
  #14 (permalink)  
Antiguo 13/06/2009, 14:47
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: diferencias con <div id=""> con <div class="">

Hola:

Kseso? no sé como coño lo consigues pero siempre me haces soltar alguna carcajada (cuando a veces es para llorar).

Saludos.

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.
Tema Cerrado




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