Selector de identificación en CSS

Selector de identificación en CSS
El selector de ID utilizó los atributos de identificación del elemento para apuntar a un elemento particular. Dado que un documento HTML debe tener una identificación única de un elemento, por lo tanto, el selector de ID se dirige a un elemento único. Es muy útil en esos escenarios donde se requieren cambios detallados. Cuando es necesario implementar el estilo en un elemento único y específico, se puede utilizar un selector de tipo como selector de identificación.

Por ejemplo, si tiene que cambiar el color de texto de todos

elementos entonces se puede utilizar el selector de elementos. Sin embargo, cuando tienes que apuntar a un solo

etiqueta que se requerirá un selector más específico, como un Selector de identificación.

Sintaxis

El selector de ID se describe con el signo # seguido de la identificación del elemento.

#IdName CSS Properties

Reglas para implementar el selector de identificación

Hay algunas reglas a seguir para tratar con selectores de identificación.

La primera regla a seguir al tratar con el selector de identificación es que debe tener al menos un carácter y no puede comenzar con un número. Por ejemplo:

Dentro de la misma página, múltiples elementos HTML no pueden tener lo mismo identificación:

Si un elemento tiene una identificación, entonces debe ser único:

La regla final es que el nombre de identificación y El valor de la propiedad debe ser lo mismo:

Ahora considere el siguiente ejemplo con la identificación de "estilo":






Selector de identificación


Bienvenido a Linuxhint.comunicarse


segundo parrafo



En el fragmento anterior, uno de los

Elements tiene el estilo de acuerdo con el "estilo" de identificación. Por lo tanto, las propiedades de #Style se aplicarán solo en eso

Elemento como se muestra en la siguiente salida:

El selector de ID se puede usar en varios elementos HTML como imágenes, párrafos, encabezados, etc.

Especificidad CSS

La especificidad CSS es un conjunto de reglas que usan las cuales el navegador web determina qué propiedad es más adecuada/apropiada para un elemento. En CSS, el selector de ID tiene la mayor especificidad entre todos los demás selectores debido a su singularidad.

Por ejemplo, el siguiente código dado tiene dos estilos que apuntan al mismo elemento i.mi.


<

Selector de identificación


Bienvenido a Linuxhint.comunicarse


segundo parrafo



Como el estilo de clase se declara primero y el párrafo apunta primero al estilo de "clase", por lo que el navegador aplicará el estilo del selector de clases?

No! El navegador determinará la especificidad de estos selectores. Como el selector de ID tiene una mayor especificidad, implementará las propiedades utilizando el selector de ID como se muestra en la salida:

Conclusión:

El Selector de identificación de CSS Usé el atributo de acceso a ID para dar estilo a un elemento HTML específico. La singularidad hace que la prioridad del selector de identificación sobre otros selectores. Tiene la mayor especificidad en comparación con todos los demás selectores. Este artículo proporcionó una comprensión detallada del selector de identificación, su sintaxis, algunas reglas que deben seguirse al tratar con selectores de identificación y, por último, proporcionó la guía sobre la especificidad de CSS.