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

[pepemanu]

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

[ArturoGallegos]

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.

[KATHYU]

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:

ul li a{
color: red;
}
 

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:

#lista{
width:50px;
}
#elemento{
color: red;
}
 

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:

.bloque{
padding: 10px;
margin: 1px solic #CCC;
}
 

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

[ArturoGallegos]

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

[pepemanu]

Iniciado por ArturoGallegos

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

[ArturoGallegos]

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!

[Rafael]

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.