“¿Alguna vez has visto a algunos padres ignorar a su único hijo mientras el resto juega porque ese niño es el mayor o algo así?? Esto generalmente sucede con el hijo mayor porque los padres piensan que él/ella podría no necesitar tanta atención. Si lo hizo, entonces el concepto de no primer tipo no será difícil de entender para usted. El selector de primer tipo de CSS se ha utilizado para ignorar simplemente al primer hijo de un padre específico y seleccionar el resto de los elementos infantiles de ese padre en particular. En otras palabras, tiene que elegir cada elemento que no sea el primer descendiente del elemento principal. En el formato del componente del primer niño), se muestra como un parámetro. Dentro de este artículo hoy, aprenderemos a usar la propiedad infantil no primera de CSS."

Ejemplo 01

Comencemos con el primer ejemplo de este artículo creando un formato de archivo HTML estándar usando etiquetas. Hemos comenzado este script HTML con la etiqueta HTML que ha sido seguida por la etiqueta de la cabeza. La etiqueta de la cabeza definió el encabezado de nuestra página web HTML. Entonces, hemos estado usando la etiqueta de título para agregar el nombre de esta página. Después del cierre de una etiqueta de título, hemos estado usando la etiqueta de título dentro de la etiqueta de la cabeza. Echaremos un vistazo a la etiqueta de la cabeza después de la discusión en el cuerpo de esta página HTML.

Dentro de la etiqueta del cuerpo, la hemos estado comenzando con el simple encabezado del tamaño 1. Junto con eso, hemos estado usando el "DL" para crear una lista de descripción. Dentro de esta lista de descripción, se ha utilizado un total de 2 especificaciones de descripción según las etiquetas "DT" que se abren y cierran en la línea 13 y 17. Las etiquetas de definición de descripción "DD" se utilizan para representar los elementos de una lista de descripción, I.mi., en las líneas 14, 15, 16, 18 y 19. La lista de descripción se ha cerrado después de agregar los elementos de descripción. El cuerpo de nuestra página HTML se ha completado. Entonces, hemos estado cerrando la etiqueta del cuerpo, yo.mi., . Ahora, echaremos un vistazo a la etiqueta de estilo de nuestra etiqueta de cabeza de hombre para peinar el cuerpo de nuestro código HTML. La especificación de descripción "DT" se ha diseñado con el peso de fuente del tamaño de fuente grande, grande, la familia de fuentes serif y el tamaño de fuente de 25px. Las etiquetas de descripción de la definición se diseñan con el margen de 4px y el tamaño de fuente de 22px.

Para las etiquetas "DD", hemos estado usando el compensación "no" (primero de tipo) para peinar a todos sus hijos, excepto el primer niño inmediato. Hemos agregado el tamaño de fuente de 18 px y el borde del sólido 3px del color amarillo verde. Ahora, este estilo solo se aplicaría al resto de las etiquetas infantiles de la etiqueta "DD" sin el estilo de su primer hijo o miembro. Se trata de la etiqueta de estilo y esta página HTML. Por lo tanto, necesitamos guardarlo y luego ejecutarlo con la opción Ejecutar del código Visual Studio.

Después de ejecutar este script HTML dentro del navegador Chrome, nos hemos mostrado debajo de la salida de la lista de descripción. El encabezado se ha mostrado sin ningún estilo, mientras que la lista de descripción ha mostrado un total de dos especificaciones de descripciones elementos de la lista principal, I.mi., Animales y animales marinos. Las especificaciones de la descripción principal son más grandes que el resto de los elementos de la lista según lo especificado por la etiqueta de estilo. Al mismo tiempo, las descripciones de definición de "DD" se han diseñado de manera diferente.

El artículo adyacente al número 1 tiene un estilo un poco más grande que el resto de los artículos. Junto con eso, todos los elementos obtuvieron un borde de color amarillo verde a su alrededor, pero el primer elemento se dejó sin cambios porque es el primer niño, y debe evitarse según el compensación de CSS del primer de tipo que no se usa en el estilo etiqueta.

Ejemplo 02

Comencemos con otro ejemplo de CSS, no un selector de compensación de primer tipo de tipo, junto con otros selectores para hacer una comparación. Entonces, hemos comenzado este código HTML con el formato HTML estándar de las etiquetas, I.mi., Comenzando desde una etiqueta HTML simple, seguida de la cabeza y la etiqueta del cuerpo. Echaremos un vistazo a la parte del cuerpo principal de este script HTML a través de la etiqueta del cuerpo, yo.mi., . Comienza con el uso de la etiqueta de encabezado

del tamaño más grande, y se cierra

con algún texto en ambas etiquetas.

Después de eso, contiene una sección "Div" para crear un nuevo contenedor dentro del área del cuerpo HTML con la clase "Parent" especificada para ser utilizada para el estilo. Este contenedor div tendría algunos párrafos y encabezados dentro de él. El encabezado de este contenedor sería de tamaño 1, comenzando con

y terminando con

. Después de esto, contiene un total de 4 párrafos dentro de él con el uso del inicio

Etiqueta y final

etiqueta. Después de que todos los párrafos se completen y se cierren, hemos estado utilizando la etiqueta para cerrar el contenedor para una mayor inserción de elementos aquí. El cuerpo de esta etiqueta HTML se ha completado aquí, ya que ha estado usando la etiqueta para cerrar la parte del cuerpo. Echemos un vistazo al encabezado de esta página HTML agregando el título a esta página con la ayuda de una etiqueta de "título" dentro de la etiqueta principal "Cabeza" de HTML. Después de esto, hemos estado utilizando la etiqueta "estilo" de HTML CSS para agregar algo de estilo al cuerpo de nuestra página HTML. Por lo tanto, se ha iniciado con la clase "Padre" y el Selector "First-Child" para agregar estilo al primer hijo del elemento particular "Div" que se ha especificado con la clase "Parent".

Ahora, el encabezado de este contenedor "div" sería de color azul con el estilo de fuente oblicuo y la familia de la fuente de cursiva. Hemos estado usando la etiqueta del párrafo "P" con el primer selector de tipo para agregar el estilo al primer párrafo del resto de los párrafos. Contendría un fondo de almendras blanqueadas y un tamaño de fuente de 2.25em. Ahora, la misma clase principal se usa con el selector "no (: primero de tipo de tipo)" para diseñar todo el mismo tipo de elementos infantiles, I.mi., "P" excepto el primer hijo del contenedor "div". Todos esos elementos serían de color verde mar con tamaños de fuente más grandes y diferentes familias de fuentes.

Además, el selector de último hijo se ha utilizado para diseñar al último hijo de la sección "Div", que también es un párrafo. Será de color naranja con un estilo de fuente normal y una familia de fuentes diferente. El estilo se ha completado aquí. Ahora, lo ejecutaremos para ver los cambios.

La salida no muestra un estilo para el primer encabezado, el primer encabezado de color azul de estilo azul oblicuo del contenedor "div", el primer párrafo se diseñaría con el fondo de color rosa claro, los siguientes dos párrafos están coloreados con color verde mar y el último párrafo es naranja de colores.

Conclusión

Este artículo contiene una breve explicación del selector CSS, no en el primero de los tipos. Para esto, hemos discutido su uso y aplicación en elementos CSS dentro del párrafo introductorio. Después de eso, lo implementamos en algunos ejemplos de script HTML para mostrar su trabajo. Junto con eso, también hemos cubierto su comparación con algunos selectores hermanos para que su trabajo sea más claro y prominente.