Uma folha de estilo em cascata é um código que afeta os elementos do código HTML. O efeito combinado forma as páginas e sites da web. Qualquer linguagem de programação usada no back-end, de preferência. Esses dois são responsáveis ​​pelas páginas da web estática. HTML e CSS, juntamente com o JavaScript, desempenham principalmente um papel em fazer um site dinâmico. Neste artigo, HTML e CSS serão usados ​​para ver a página da web criada.

Às vezes, encontramos tal situação em que queremos evitar alguns itens ou conteúdo entre o grupo dos mesmos itens. Para especificá -los custa manualmente tempo. Portanto, para evitar o consumo de tempo, o CSS refere -se a propriedades tão eficazes e eficientes para usá -las no código que é facilmente compreensível e torna o código gerenciável. Isso é feito pela propriedade CSS “não a primeira”.

Não: propriedade do primeiro filho

Esta propriedade CSS é usada para selecionar todo o conteúdo HTML do mesmo tipo que não o primeiro. Esta propriedade é oposta à propriedade CSS do "CSS First of Type", responsável por afetar apenas a primeira do conteúdo da maior parte do HTML do mesmo tipo. Além de adicionar um estilo a todas as tags pelo CSS embutido, evitando o primeiro, não: a propriedade do primeiro filho removeu a ambiguidade criada por ter a bagunça do CSS embutido que torna o código difícil de entender e complicado. Adicionamos apenas um pequeno pedaço de código no CSS interno ou externo, especificando o conteúdo HTML, onde queremos aplicar esta propriedade. Então o primeiro filho é automaticamente afetado.

Sintaxe:
A sintaxe para a propriedade Not: Primeiro filho é a seguinte:

Content_name: não (: primeiro filho)
Valor da propriedade; \\ qualquer efeito que queremos aplicar nos itens html que não sejam os primeiros.

Exemplo 1: não: Primeiro filho do parágrafo

Para elaborar o conceito de não ter um primeiro filho, usamos o

parágrafos do conteúdo HTML para aplicar esta propriedade. Os parágrafos são o conteúdo HTML que se diz ser um monte de linhas de texto. Essas linhas são sequenciadas e alinhadas de forma a formar um parágrafo. O código contém a etiqueta corporal. Usamos os dois títulos simples e os três parágrafos que contêm o texto simples de algumas palavras com eles. Usamos um texto de amostra de Lorem ipsum.

Só precisamos ver os resultados da propriedade. Para simplificar, apenas este conteúdo é declarado. Em seguida, feche as tags do corpo.

A seção da cabeça contém apenas a tag de estilo para torná -la um CSS interno.

Use a tag de parágrafo

com a propriedade Not: Primeiro filho para aplicar todos os efeitos em todos os parágrafos, exceto o primeiro. Adicionamos a cor da fonte vermelha aos parágrafos. Feche todas as tags abertas.

Salve o código com a extensão HTML para o editor de texto. Esta extensão faz o ícone do arquivo como o navegador padrão. Este ícone garante que o arquivo seja uma página da web.

Exemplo 2: Não: Primeiro filho na lista

As listas HTML são uma maneira importante de representar o texto. Para implementar a propriedade CSS do seletor de primeiro filho, usamos as duas listas. Para elaborar ainda mais, precisamos primeiro ter o conhecimento das listas HTML. Dois tipos de listas são criados através da linguagem HTML - uma lista não ordenada

e uma lista ordenada
. A maneira de declarar é a mesma para os dois. Dentro
e
, Todos os itens estão escritos com
1. Tag.
   
   
   • Element1
   
   
   • Element2
   
   

   Agora, voltando ao exemplo, usamos duas listas não ordenadas. Ambas as listas são declaradas dentro da div. Primeiro, considere a seção corporal html do código. Dois títulos simples,

   e

   , são declarados. Em seguida, a tag div é usada para declarar um contêiner div. Dentro da div, o primeiro

   A lista é declarada. Um CSS em linha para a propriedade de margem é adicionado. Esta propriedade de margem também é aplicada na segunda div.

   Uma propriedade de margem é o valor CSS da distância do objeto da borda da tela de fundo. Por exemplo, a margem da lista aqui é declarada para criar a lista a uma distância especificada.

   Ambas as listas são declaradas da mesma forma que tendo três itens de lista. Agora, feche todas as tags e siga em direção ao CSS interno. O cabeçalho é aplicado pela propriedade da cor da fonte. Então, a parte principal do código não: a propriedade do primeiro filho é aplicada.

   Esta propriedade é aplicada no

   tag, como as duas listas não são ordenadas. Mas verifique se essas listas estão de forma independente ou estão presentes em qualquer outro contêiner. Como sabemos que declaramos as duas listas dentro da div, precisamos mencionar a div com o
   tag para que a propriedade seja aplicada em todas as listas dentro da div, exceto a primeira.
   Div ul: não (: primeiro filho)
   Background-Color: roxo;
   Cor branca;
   Intensidade da fonte: Negrito;
   Largura: 40%;
   

   A div e

   são aplicados com as características de ter uma cor de fundo e a cor da fonte. O peso da fonte está definido como ousado. A largura da lista também é declarada.

   Feche todas as tags. Salve o arquivo e implemente -o no navegador para ver os resultados.

   Você verá que a primeira lista aparece por padrão sem nenhuma alteração aplicada a ela. Enquanto a segunda lista é afetada por todos os valores e propriedades que aplicamos à etiqueta da lista não ordenada na seção da cabeça.

   Da mesma forma, se aplicarmos qualquer propriedade a todos os

   Tags como fizemos antes, mas sem usar a propriedade Not: Primeiro filho para as listas, o que acontecerá?
   Div ul
   Estilo de fonte: itálico;
   

   Definimos o estilo de fonte como itálico em todo o UL da div. Mas os valores que são escritos dentro da propriedade de seletor infantil não primeiro são aplicados em todas as listas, exceto o primeiro.

   Aplique os dois estilos no mesmo código corporal. Salve e implemente. Vemos que o estilo itálico é aplicado em todos os itens da lista porque não mencionamos a propriedade Not: Primeiro Child com eles. Enquanto os valores que possuem o seletor é aplicado apenas na segunda lista.

   Conclusão

   O CSS não: Primeiro filho nos dá conhecimento sobre o uso de propriedades CSS em todos os elementos do HTML em vez do primeiro. A condição para implementar esse fenômeno é que todo o conteúdo HTML deve ser do mesmo tipo, caso contrário, esse efeito não será aplicado. Desde o início, conversamos sobre o uso básico HTML e CSS. Então, o CSS não: Primeiro filho é explicado ao dar uma sintaxe que é seguida pela aplicação desta propriedade. Em seguida, implementamos esse conceito em dois conteúdos HTML diferentes: um é o parágrafo e o outro é o contêiner Div.