Como usar o: não () Selector em CSS3

Em alguns casos, é mais fácil para selecionar objetos em CSS3 acordo com as características que eles não tem - para fazer isso, você pode usar um: não (selector). Por exemplo, você pode querer alterar a formatação de cada objeto que não se encontra numa

tag.

Neste caso, você pode criar uma lista de tags usando o seletor de vírgula e esperamos que sua lista está completa, ou você pode simplesmente usar o: selector não (). Por exemplo,: não (p) seleciona todos os objetos que não seja um

tag. Você também pode criar seleções complexas usando o: não () seletor: Um seletor de: não (div> p), por exemplo, seleciona todos os

etiqueta que não tem um

Mesmo com esta pequena lista de seletores de tag, você pode ver que CSS é bastante flexível quando se trabalha com tags. Vendo os seletores em ação irá ajudá-lo a compreendê-los um pouco melhor. O procedimento a seguir mostra como usar as várias tags:

1. Criar o arquivos ExternalCSS.HTML e ExternalCSS.CSS e copiá-los para uma nova pasta.

2. Abrir ExternalCSS.HTML.

3. Digite o seguinte código após o existente

   marca no arquivo e salvar as alterações no disco.

   Texto dentro de uma DIV.
   Texto com um pai DIV.
   Texto após uma DIV.
   Mais texto depois de uma DIV.

   Este código simplesmente adiciona marcas em modalidades específicas para que você possa testar os vários seletores. Se você abrir o arquivo resultante agora, verá que cada um dos

   Tag foi automaticamente formatado como o original

   tag.

   

4. Abrir ExternalCSS.CSS.

5. Digite o seguinte código após os estilos existentes e salvar as alterações no disco.

   div> p {text-align: right;} inserir a imagem por 2,2 AQUI

6. Atualizar a página de teste.

   Repare que a única

   tag que tem sido afetada é a que tem o

   tag como um pai direto. Além disso, observe que as cascatas de formatação anteriores para a formatação atual. Você não tiver substituído qualquer um a formatação existente, de modo que o texto aparece como antes - ele simplesmente usa direita; justificação ao invés do padrão esquerda; justificação.
   

7. Digite o seguinte código após os estilos existentes e salvar as alterações no disco.

   div p {text-decoration: line-through-background-color: # ff7f7f-}

8. Atualizar a página de teste.

   Note-se que duas linhas são afectados neste momento. Além disso, o estilo de background-color foi alterada, de modo que essas duas linhas de usar a nova cor - ele tem precedência sobre a cor original. Quando você pensa sobre a parte em cascata do CSS, pensar em um fluxo onde as mudanças jusante ter precedência sobre o estado original da água.

   

9. Digite o seguinte código após os estilos existentes e salvar as alterações no disco.

   div + p {font-family: monospace-font-style: italic-}

10. Atualizar a página de teste.

    Apenas a linha que aparece logo após a

    é afetada: O tipo de letra mudou para uma fonte monoespaçada (normalmente reservado para código) e está em itálico.
    

11. Digite o seguinte código após os estilos existentes e salvar as alterações no disco.

    div ~ p {font-weight: bolder-font-size: 30px; margin: 0px; color: # 7f007f-}

12. Atualizar a página de teste.

    

Observe que tanto

tags que aparecem após o