Foros del Web » Creando para Internet » CSS »

Duda entre qué es un selector y una clase en CSS

Estas en el tema de Duda entre qué es un selector y una clase en CSS en el foro de CSS en Foros del Web. Hola Estoy aprendiendo a usar Dreamweaver y por los videos que estoy viendo, estoy empezando a perderle el miedo al HTML y al CSS que ...
  #1 (permalink)  
Antiguo 13/03/2017, 18:47
 
Fecha de Ingreso: febrero-2009
Mensajes: 46
Antigüedad: 8 años, 10 meses
Puntos: 0
Duda entre qué es un selector y una clase en CSS

Hola
Estoy aprendiendo a usar Dreamweaver y por los videos que estoy viendo, estoy empezando a perderle el miedo al HTML y al CSS que ni sabía lo que era. Ahora he aprendido que el HTML se basa en etiquetas y que el CSS les aplica estilo, color, posición, efectos a esas etiquetas. Tenemos dos lenguajes que crean la página, y ambos se necesitan y complementan. Podemos ver por un lado el codigo HTML y por otro lador, el código CSS. Ambos códigos están relacionados, ya que el CSS da formato, estilo, al HTML. En una página concreta, tendremos por tanto, dos códigos por separado, el HTML y el CSS. Ambos están relacionados.

Para aplicarle un estilo, hay que usar un selector, es decir, hay que seleccionar la etiqueta en el modulo CSS en Dreamweaver, y aplicarle un efecto determinado.

Ahora... lo que no entiendo muy bien, es qué diferencia hay entre un selector y una clase, ya que ambos parecen hacer lo mismo.

Creo que sé la diferencia, pero no estoy muy seguro.

Si yo por ejemplo, selecciono una etiqueta de mi código HTML y ahora me voy al modulo CSS y le aplico el formato como un selector, entonces ese estilo se va a aplicar a todas las etiquetas que sean iguales en mi código HTML

Mientras que si yo selecciono una etiqueta HTML en mi código... y añado un selector, pero lo convierto en clase, escribiendo un punto .mietiquetahtml lo que va a pasar es que el estilo que yo aplique, se va a aplicar concretamente a esa etiqueta del código html y no a todas las etiquetas que sean iguales dentro de mi código HTML. Por eso hago una clase, que sería como crear una clase especial de objeto, al que voy a manipular para darle un diseño individual del resto. Una vez creada la clase en el CSS tengo que cambiar en mi código HTML esa etiqueta incorporándole una clase <etiquetaquesea class="nombredelaclasequepuseenCSSahorasinelpunto" >
Escribo en mi código HTML el nombre de la clase que escribi en el CSS pero ahora sin el punto. De esa forma ya he creado una clase identificando una etiqueta concreta en mi código HTML y creando un estilo concreto para esa etiqueta (que es en realidad, una clase).

¿Es correcto?

En la práctica, una web compleja más que selectores en CSS debería tener algunos selectores y muchas clases, ya que individualizaría el diseño en cada elemento de la pantalla.
No se si me equivoco, pero si me equivoco o hay algo que no entiendo bien, os rogaría vuestros comentarios.
Saludos

Última edición por pepemanu; 13/03/2017 a las 18:55
  #2 (permalink)  
Antiguo 14/03/2017, 02:47
Avatar de ArturoGallegos
Moderador
 
Fecha de Ingreso: febrero-2008
Ubicación: Morelia, México
Mensajes: 5.823
Antigüedad: 9 años, 9 meses
Puntos: 951
Respuesta: Duda entre qué es un selector y una clase en CSS

Un selector y una clase CSS es exactamente lo mismo, no hay diferencia.

Lo unico que lo podria distingir es que decir Selector CSS es bastante ambiguo o general mientras una decir Clase CSS estas refiriendote a un tipo de selector en particular.
__________________
Toda ayuda se proporciona exclusivamente en el foro, no skype, no mensajes privados u otro medio....
  #3 (permalink)  
Antiguo 14/03/2017, 09:17
Avatar de KATHYU  
Fecha de Ingreso: julio-2013
Mensajes: 508
Antigüedad: 4 años, 4 meses
Puntos: 41
Respuesta: Duda entre qué es un selector y una clase en CSS

Como ya se lo explicaron un selector es la palabra que designa como vamos a seleccionar un tipo de elemento de CSS (dicho en palabras simples y sencillas)

Hay varios selectores:
Elemento: Es cuando pones el nombre de los elementos HTML como tal. ul > li > a > p y el el CSS haces referencia a esos elementos
Código CSS:
Ver original
  1. ul li a{
  2. color: red;
  3. }

ID: Es el indicador o indice de cada elemento. <li id="lista"> <a id="elemento"> y en el CSS haces referencia a el por ese ID que debe ser unico
Código CSS:
Ver original
  1. #lista{
  2. width:50px;
  3. }
  4. #elemento{
  5. color: red;
  6. }

Clase: Con la clase le da a todos los elementos que la contengan el mismo estilo, sirve para escribir una sola vez el código CSS y usarlo en miles de elementos.
<ul class="bloque">, <p class="bloque">, <input class="bloque">, <label class="bloque">
Código CSS:
Ver original
  1. .bloque{
  2. padding: 10px;
  3. margin: 1px solic #CCC;
  4. }

Prestar mucha atención que cuando se referencéa un elemento se escribe como tal, cuando es un ID se le antepone al nombre el # y cuando es una clase, se le antepone un punto (.)

Espero me de a entender y espero no tener error en el codigo de ejemplo que puse
__________________
Al contrario de lo que muchos podrían afirmar, ayudar no te hace pobre, sino más rico.
  #4 (permalink)  
Antiguo 14/03/2017, 14:13
Avatar de ArturoGallegos
Moderador
 
Fecha de Ingreso: febrero-2008
Ubicación: Morelia, México
Mensajes: 5.823
Antigüedad: 9 años, 9 meses
Puntos: 951
Respuesta: Duda entre qué es un selector y una clase en CSS

Creo que solo falto explicar el resto de selectores, pero como a mi me da pereza escribirlos todos mejor le paso un link

http://librosweb.es/libro/css_avanzado/capitulo_3.html

vas a encontrar interesantes los del apartado 3.6
__________________
Toda ayuda se proporciona exclusivamente en el foro, no skype, no mensajes privados u otro medio....
  #5 (permalink)  
Antiguo 19/03/2017, 17:41
 
Fecha de Ingreso: febrero-2009
Mensajes: 46
Antigüedad: 8 años, 10 meses
Puntos: 0
Respuesta: Duda entre qué es un selector y una clase en CSS

Cita:
Iniciado por ArturoGallegos Ver Mensaje
Un selector y una clase CSS es exactamente lo mismo, no hay diferencia.

Lo unico que lo podria distingir es que decir Selector CSS es bastante ambiguo o general mientras una decir Clase CSS estas refiriendote a un tipo de selector en particular.
Eso es lo que yo ya había dicho antes. Selector, aplica formato a todas las etiquetas en el código HTML. Clase, aplica el formato CSS a una sola etiqueta (por tanto a un solo objeto o bien a los objetos que pertenezcan a esa clase).

Más fácil explicado.

DIFERENCIA ENTRE SELECTOR Y CLASE EN CSS

Selector CSS
Si voy al modulo CSS y le aplico el formato a una etiqueta HTML como un selector, entonces ese estilo se va a aplicar a todas las etiquetas que sean iguales en mi código HTML

Clase en CSS
Si yo selecciono una etiqueta HTML en mi código... y añado un selector, pero lo convierto en clase, escribiendo un punto .mietiquetahtml (la clase se crea escribiendo un punto antes de su nombre) lo que va a pasar es que el estilo que yo aplique, se va a aplicar concretamente a esa etiqueta del código html y no a todas las etiquetas que sean iguales dentro de mi código HTML. Por eso hago una clase, que sería como crear una clase especial de objeto
  #6 (permalink)  
Antiguo 19/03/2017, 21:45
Avatar de ArturoGallegos
Moderador
 
Fecha de Ingreso: febrero-2008
Ubicación: Morelia, México
Mensajes: 5.823
Antigüedad: 9 años, 9 meses
Puntos: 951
Respuesta: Duda entre qué es un selector y una clase en CSS

Me has dejado anonadado y con cara de WTF? todo gariboleado y de mas pero tengo fe en que te acomodas a si y lo harás bien, suerte!
__________________
Toda ayuda se proporciona exclusivamente en el foro, no skype, no mensajes privados u otro medio....
  #7 (permalink)  
Antiguo 21/03/2017, 00:10
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 8.954
Antigüedad: 14 años, 9 meses
Puntos: 1802
Respuesta: Duda entre qué es un selector y una clase en CSS

Hum. No. Estas interpretaciones están erradas.

Un Selector es el patrón para identificar a qué elemento se va a aplicar un estilo. Es un patrón.

En ese sentido un class es un selector.

.rojo

Pero también lo es un elemento

p

Y también lo es una cadena por ejemplo de descendientes

div>p

Este patrón puede incluir elementos, clases y conectores (o combinadores).

.menu>div>p

Los que están contabilizando como h1 y p son selectores simples o de elementos.

Lo que conviene revisar es la especificación oficial.

https://www.w3.org/TR/css3-selectors

Otros tipos de selectores son los de ID, atributos, pseudo elementos, pseudo clases y los combinadores, de hermanos, descendientes y adyacentes.

Última edición por Rafael; 21/03/2017 a las 00:25

Etiquetas: clase, efecto, selector
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 17:09.