1. Casa
  2. Una combinazione di selettori CSS

Il miglior tutorial Una combinazione di selettori CSS Nel 2024, in questo tutorial puoi imparare Una combinazione di selettori CSS,Offspring Picker,Esempi,selettori per bambini,Esempi,Selettore fratello adiacente,Esempi,Ordinaria selettori di fratelli adiacenti,Esempi,

Una combinazione di selettori CSS

Una combinazione di selettori CSS

nota selettori di combinazione illustrano il rapporto diretto tra i due selettori.

selettori CSS includono una combinazione di varie combinazioni di selettori semplici.

In CSS3 contiene quattro combinazioni:

  • selettore discendente (separati da spazi)
  • Selettore elemento figlio (maggiore di delimitato)
  • selettore fratello adiacente (più delimitato)
  • Selettore Fratello ordinaria (separati da un trattino)

Offspring Picker

selettore di discendente corrisponde a tutti gli elementi degni elementi discendenti.

L'esempio seguente seleziona tutti gli elementi <p> ​​nell'elemento <div>:

Esempi

div p
{
background-color:yellow;
}

Prova »

selettori per bambini

Rispetto ai selettori discendenti, sub-selettori (selettori Bambino) possono selezionare un elemento come elemento figlio dell'elemento.

I seguenti esempi selezionati <div> in tutti gli elementi figli diretti <p>:

Esempi

div>p
{
background-color:yellow;
}

Prova »

Selettore fratello adiacente

selettore fratello adiacente (selettore fratello adiacente) scegliere un altro elemento subito dopo l'elemento, ed entrambi hanno lo stesso elemento genitore.

Se necessario selezionare un altro elemento subito dopo l'elemento, ed entrambi hanno lo stesso elemento genitore, è possibile utilizzare il selettore fratello adiacente (Adiacente selettore di pari livello).

L'esempio seguente seleziona tutto il primo nell'elemento <div> dopo l'elemento <p>:

Esempi

div+p
{
background-color:yellow;
}

Prova »

Ordinaria selettori di fratelli adiacenti

selettore fratello adiacente comune per selezionare tutti gli elementi di pari livello specificati.

L'esempio seguente seleziona tutti gli elementi <div> di tutti fratello adiacente <p>:

Esempi

div~p
{
background-color:yellow;
}

Prova »

Tutorial caldi

Contattaci

Una combinazione di selettori CSS
10/30