Foros del Web » Creando para Internet » CSS »

duda css (#etiqueta,. etiqueta, )

Estas en el tema de duda css (#etiqueta,. etiqueta, ) en el foro de CSS en Foros del Web. buenas compañeros y perdonad mi poco uso de css ( iniciandome en ello) una question, no encuentro la diferencia entre teclarar una etiqueta con #delante ...
  #1 (permalink)  
Antiguo 20/05/2009, 15:17
 
Fecha de Ingreso: abril-2008
Mensajes: 144
Antigüedad: 9 años, 8 meses
Puntos: 1
Pregunta duda css (#etiqueta,. etiqueta, )

buenas compañeros y perdonad mi poco uso de css ( iniciandome en ello) una question, no encuentro la diferencia entre teclarar una etiqueta con #delante o sin esto... por ejemplo... o con un punto "." delante.... tienge este algun significado especial? muestro ejemplo siguiente gracias!!

Código PHP:
#topbottom{
    
clearboth;
    
backgroundurl(images/toptopbottom.gifbottom right no-repeat;
    
height10px;
}
/* just the c#content box*/
h2{
    
fontnormal normal 1.5em "Georgia",serif;
    
color#000;
    
text-decorationnone;
    
backgroundurl(images/h2.giftop left no-repeat;
    
padding3px 0 0 8px;
}
h3{
    
fontnormal normal 1em "Georgia",serif;
    
text-transformuppercase;
    
text-indent2em;
    
margin7px 0 2px 0;
}
#headline{
    
backgroundurl(images/header.jpgno-repeat top left;
    
width590px;
    
height90px;
    
positionrelative;
}
#headline h1{
    
positionabsolute;
    
bottom5px;
    
right5px;
    
color#FFF;
    
margin0;
    
padding0;
    
text-decorationnone;
    
fontnormal normal 2.2em "Trebuchet MS","Arial",sans-serif;
}
p{
    
text-indent1.3em;
    
margin0 0 5px 0;
    
padding0;
}
/* sidebar */
#inner{
    
padding0 10px;
}
form{
    
margin0;
    
padding0 0 30px 0;
    
border-bottom1px #999 solid;
}
form input{
    
background#F5F5F5;
    
border0;
    
border-bottom1px #EFEFEF dotted;
}
form label{
    
font-family"Georgia",serif;
}
form .button{
    
background#FFF;
    
border-bottomnone;
    
cursorpointer;
}
form a{
    
font-family"Georgia",serif;
}
h5{
    
backgroundurl(images/nav-h.gifcenter left no-repeat;
    
font1.5em "Arial",sans-serif;
    
padding-left25px;
    
margin7px 0 3px 3px;
}
.
nav{
    
margin2px;
    
padding0;
}
.
nav li{
    
displayinline;
    list-
style-typenone;
    
}
.
nav li a{
    
displayblock;
    
background#EFEFEF;
    
padding1px 1px 1px 5px;
    
margin1px;
    
text-decorationnone;
    
color#000;

algunos con # otros sin nada.. otros con un punto.. "."


gracias amigos! :P
  #2 (permalink)  
Antiguo 20/05/2009, 15:40
Avatar de willyfc  
Fecha de Ingreso: octubre-2008
Ubicación: Santa Cruz - Bolivia
Mensajes: 662
Antigüedad: 9 años, 2 meses
Puntos: 40
Respuesta: duda css (#etiqueta,. etiqueta, )

El # es un identificador, el . es una clase y si no llevan ninguna de las dos es solo una etiqueta html que tomará los estilos que les des.

Pues hacer tu web solo con id o solo con clases, o con ambos, pienso que el trabajo es lo que decidirá que es lo que combiene.

Un id, al llamarse identificador(#) solo se puede utilizar una vez en un documento y las clases(.) las veces que quieras, por ejemplo no podrías hacer esto:

Código:
<div id="derecha">
   <div id="texto">contenido</div>
</div>
<div id="centro">
   <div id="texto">contenido</div>
</div>
se esta declarando 2 veces el id texto, esto según la W3C es incorrecto y no entra en los estándares.Lo correcto sería:

Código:
<div id="derecha">
   <div class="texto">contenido</div>
</div>
<div id="centro">
   <div class="texto">contenido</div>
</div>
<div id="izq">
   <div class="texto">contenido</div>
</div>
y las etiquetas que están solas son solo de html. si colocas

Código:
h2{color:#999;font-size:2em;}
esto quiere decir que esto afectará a todos los h2 de tu web.O puedes de esta manera:

Código:
.texto h2{color:#999;font-size:2em;}
afectará a todos los h2 que sean declarados dentro de la clase texto.

y así las veces que quieras.Espero haber sido claro(aunque sea un poco, es que me cuesta bastante explicar).
__________________
WFC
codigo82
  #3 (permalink)  
Antiguo 20/05/2009, 15:42
 
Fecha de Ingreso: abril-2008
Mensajes: 144
Antigüedad: 9 años, 8 meses
Puntos: 1
De acuerdo Respuesta: duda css (#etiqueta,. etiqueta, )

Cita:
Iniciado por willyfc Ver Mensaje
El # es un identificador, el . es una clase y si no llevan ninguna de las dos es solo una etiqueta html que tomará los estilos que les des.

Pues hacer tu web solo con id o solo con clases, o con ambos, pienso que el trabajo es lo que decidirá que es lo que combiene.

Un id, al llamarse identificador(#) solo se puede utilizar una vez en un documento y las clases(.) las veces que quieras, por ejemplo no podrías hacer esto:

Código:
<div id="derecha">
   <div id="texto">contenido</div>
</div>
<div id="centro">
   <div id="texto">contenido</div>
</div>
se esta declarando 2 veces el id texto, esto según la W3C es incorrecto y no entra en los estándares.Lo correcto sería:

Código:
<div id="derecha">
   <div class="texto">contenido</div>
</div>
<div id="centro">
   <div class="texto">contenido</div>
</div>
<div id="izq">
   <div class="texto">contenido</div>
</div>
y así las veces que quieras.Espero haber sido claro(aunque sea un poco, es que me cuesta bastante explicar).
super claro!!! perfecto! :) es la respuesta que necesitava!! muuuuuuchas gracias! :)

un saludo!
  #4 (permalink)  
Antiguo 20/05/2009, 15:43
Avatar de DragonX
Colaborador
 
Fecha de Ingreso: mayo-2002
Ubicación: Funkyland
Mensajes: 8.339
Antigüedad: 15 años, 6 meses
Puntos: 153
Respuesta: duda css (#etiqueta,. etiqueta, )

los tags reservados de html se escriben sin nada, como ser:
Cita:
h1 / h2 / p / img / body / span / ul / li
Los ID's (elementos único e irrepetibles dentro de tu código) se escriben con numeral adelante
Cita:
#divcontenido / #divfooter / #divheader
y los Class (se pueden utilizar todas las veces que quieras dentro del código) se escriben con punto(.) adelante
Cita:
.rojo / .listaschicas / .efectocaja
Espero haberte ayudado.
Slds.-
  #5 (permalink)  
Antiguo 20/05/2009, 15:47
Avatar de dacho  
Fecha de Ingreso: junio-2008
Ubicación: Argentina
Mensajes: 374
Antigüedad: 9 años, 6 meses
Puntos: 21
Respuesta: duda css (#etiqueta,. etiqueta, )

Hola amigo, te comento:

Como primero lo que deberiamos tener en cuenta es que existen elementos en HTML, estos elementos (h1, h2, p, a img, form, div o lo que sea) pueden ser unicos en la pagina o pueden estar repetidos.

Es decir por ejemplo encabezados hay uno en la pagina, al menos generalmente, entonces si definimos un div para un encabezado, podemos colocaremos en el HTML

Código HTML:
<div id="header">
 <h1>El titulo de mi paginas</h1>
<p>Mi pagina es para que entres y la veas :)</p>
</div> 
Ese podria ser un encabezado en HTML para la pagina, ahora si yo quiero que ese encabezado sea instanciado en el css tengo 2 formas:

Código HTML:
div{ aqui pongo las propieedades del div }
o
Código HTML:
div#header{ aqui pongo las propieedades del div }
Cual es la direfencia? bueno, la diferencia principal es que del primer modo cada vez que coloques un elemento div en la pagina tomara las propiedades que pusiste. En cambio de la segunda forma solo cambiara o dara las propiedades que colocaste en el div que contenga el id="header", es decir:

Si tenes un elemento con un id="ejemplo" en el html, la forma de instanciarlo en el css es

#ejemplo


Ademas una caracterisitica de usar ID es que solo puede utilizarse 1 vez, es decir si colocas un id es porque es unico en la pagina. Ahora si es un elemento que esta repetido muchas veces y le queres dar un estilo, entonces tenes que utilizar class, por ejemplo de la siguiente forma:

Código HTML:
<div id="contenido">
 <h2>noticia 1</h2>
<p class="noticia">aqui ponemos el resumen de la noticia y aparecera en el formato que le de al css</p>
 <h2>noticia 2</h2>
<p class="noticia">aqui ponemos el resumen de la noticia y aparecera en el formato que le de al css</p>
 <h2>noticia 3</h2>
<p class="noticia">aqui ponemos el resumen de la noticia y aparecera en el formato que le de al css</p>
</div> 
Si tenes un elemento con un class="ejemplo" en el html, la forma de instanciarlo en el css es

.ejemplo{}

------------------------------------------------------------------

Ademas las estructuras de las paginas son complejas generalmente, es decir que la forma de instanciar elementos es instanciar todo los elementos que lo contienen y el mismo elemento luego, esto permite además heredar propiedades de los elementos padres, como tamaños, tipografias, fondos, etc.

La mejor forma de armar un html con css es tener estructuras de html claras, y ordenadas, te recomiendo que te busques un tutor o un curso de estas dos cosas para poder aprender como armar bien als cosas y para que sirve cada elemento y con el tiempo y practicas aprenderas cual es la mejor forma de trabajar, es decir la que te ahorra mucho tiempo en la creacion y actualizacion de paginas.

espero que te sirva si tenes alguna duda pregunta
__________________
Curso de SEO y HTML.
Diprox.com.ar // Diseño Web.
Mi twitter: @soydacho
  #6 (permalink)  
Antiguo 20/05/2009, 15:49
Avatar de dacho  
Fecha de Ingreso: junio-2008
Ubicación: Argentina
Mensajes: 374
Antigüedad: 9 años, 6 meses
Puntos: 21
Respuesta: duda css (#etiqueta,. etiqueta, )

jaaa.. me ganaron... bueno que bueno que hayas entendido :)
__________________
Curso de SEO y HTML.
Diprox.com.ar // Diseño Web.
Mi twitter: @soydacho
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

SíEste tema le ha gustado a 1 personas




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