Foros del Web » Creando para Internet » CSS »

los . y los #

Estas en el tema de los . y los # en el foro de CSS en Foros del Web. Amigos. Una pregunta.. cuando se arma una hoja de estilos que significan los "." y los "#" por ejemplo .texto{estilos...} #letras{estilos...}...
  #1 (permalink)  
Antiguo 27/12/2006, 21:39
 
Fecha de Ingreso: abril-2005
Mensajes: 491
Antigüedad: 12 años, 8 meses
Puntos: 1
los . y los #

Amigos.

Una pregunta..

cuando se arma una hoja de estilos que significan los "." y los "#"

por ejemplo

.texto{estilos...}
#letras{estilos...}

  #2 (permalink)  
Antiguo 27/12/2006, 22:23
Avatar de Escoffie  
Fecha de Ingreso: abril-2003
Ubicación: Mérida, Yucatán
Mensajes: 242
Antigüedad: 14 años, 7 meses
Puntos: 9
Re: los . y los #

Hola Under_ground:

Trataré de ser concreto, pero completo.

Elementos:

Es cualquier "objeto" al que puedas hacer referencia en un lenguaje de marcación, como por ejemplo, la etiqueta <strong> o <img> o cualquier otra.

Estos elementos pueden ser etiquetas, clases o identificadores (ID).

Selectores:

Lo que va antes de los {} se llama selector, y sirve, como su nombre lo indica, para "seleccionar" un elemento en un lenguaje de marcación (como el HTML, el XML o el XHTML que está a medio camino entre los dos).

Tipos de selector:

Etiquetas:

Cualquier etiqueta de un lenguaje de mercación. En el caso de (X)HTML, algunas muy comunes son: <body>, <div>, <h1>, <p>, etc.
Si haces una regla como:
h1 { color:red;}
p { width: 300px; }
le estás diciendo a todos los elementos marcados como <h1> que sean de color rojo, y a todos los párrafos que tengan una anchura máxima de 300 píxeles.

Clases:

A veces no quieres que un estilo afecte a todos los elementos con el mismo marcador, es decir, no quieres que todos los párrafos sean de 300px de ancho, sino sólo aquellos a los que quieras aplicarles dicho estilo, aquí es cuando se usan las clases.
Si tienes un estilo como:
.miAnchura { width:300px; }
Y luego tienes un HTML como este:
<p>Párrafo normal</p>
<p class="miAnchura">Párrafo de 300px de ancho</p>
sólo aquél que tiene el atributo class="miAnchura" (nótese que en el HTML NO lleva el punto) se verá afectado.
Esta clase se la puedes asignar a "casi" cualquier etiqueta (el casi es motivo de otro tema que no entra a juego por ahora).
Las clases las puedes usar las veces que quieras en un archivo. Es decir, pueden haber por ejemplo tres etiquetas <p> una <img> y un <h2> con la misma clase.

ID:

El HTML admite un atributo llamado ID que permite asignarle un nombre único a cada elemento.
Su sintaxis en HTML es así:
<h1 id="principal">El encabezado principal</h1>
La condición es que NO debes repetir ese ID en el mismo archivo. Es decir, que mientras las clases las puedes reciclar, los ID sólo se usan una vez por página.
En CSS, si queremos que el elemento llamado "principal" sea azul, escribimos una regla así:
#principal { color:navy;}

En resumen:
.nombre --> para clases (atributo class en la etiqueta). Se puede repetir.
#nombre --> para id (atributo id en la etiqueta). Debe ser único.
nombre --> para etiquetas. Afecta a todos los elementos marcados con dicha etiqueta.

Lo interesante está cuando las empiezas a combinar, pero eso ya es otro tema.

Googlea sobre tutoriales de XHTML.

Espero haber sido de ayuda. Saludos.
  #3 (permalink)  
Antiguo 27/12/2006, 22:25
Avatar de LuisDark  
Fecha de Ingreso: marzo-2004
Ubicación: Venezuela
Mensajes: 687
Antigüedad: 13 años, 8 meses
Puntos: 5
Re: los . y los #

saludos... aqui tienes este link a ver si te sirve de algo

.clase = aplicable a varios elementos
#id = identificador unico de un elemento

esto quiere decir que si yo declaro:

.algo {
margin:0px;}

"algo" se puede aplicar a muchos elementos que deseemos que tenga un margen de 0 en todos sus lados. (class="algo")

#algo {
float:left;}

con esta sintaxis nos referimos solamente a que un elemento estara "flotando" a la izquierda (id="algo")

espero que te sirva de algo :P
saludos
  #4 (permalink)  
Antiguo 27/12/2006, 22:27
Avatar de LuisDark  
Fecha de Ingreso: marzo-2004
Ubicación: Venezuela
Mensajes: 687
Antigüedad: 13 años, 8 meses
Puntos: 5
Re: los . y los #

jaja mientras escribia mi "simple" explicacion.. el compañero Escoffie se adelanto con una buena y mas extensa explicacion..

saludos
  #5 (permalink)  
Antiguo 27/12/2006, 22:30
 
Fecha de Ingreso: abril-2005
Mensajes: 491
Antigüedad: 12 años, 8 meses
Puntos: 1
Re: los . y los #

se pasaron con las explicaciones y gracias por su tiempo, muy buena tela man´s y vale por tu explicación Escoffie muy precisa
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 08:20.