⊗mkPmSlGSS 78 of 250 menu

Seletor de Irmãos Geral em CSS

O seletor de irmãos geral ~ permite selecionar todos os elementos que estão após um determinado elemento dentro do mesmo pai.

Exemplo

Vamos direcionar todas as tags p que estão após as tags h2 e colorir elas em vermelho:

<div> <h2>texto</h2> <p> +++ </p> <p> +++ </p> <p> +++ </p> </div> <p> - </p> h2 ~ p { color: red; }

:

Exemplo

Vamos direcionar todas as tags p que estão após os elementos com a classe .test, e colorir elas em vermelho:

<div> <p class="test"> texto </p> <p> +++ </p> <p> +++ </p> </div> <p> --- </p> .test ~ p { color: red; }

:

Exemplo

Vamos direcionar todos os elementos com a classe .elem, que estão após os elementos com a classe .test, e colorir eles em vermelho:

<div> <p class="test"> texto </p> <p class="elem"> +++ </p> <p> --- </p> <p class="elem"> +++ </p> </div> <p> --- </p> .test ~ .elem { color: red; }

:

Tarefas Práticas

Dado o código:

<ul> <li>1</li> <li>2</li> <li>3</li> <li>4</li> <li id="elem">5</li> <li>6</li> <li>7</li> <li>8</li> <li>9</li> </ul>

Escreva um seletor que selecionará todos os elementos que estão após o elemento #elem.

Português
AfrikaansAzərbaycanБългарскиবাংলাБеларускаяČeštinaDanskDeutschΕλληνικάEnglishEspañolEestiSuomiFrançaisहिन्दीMagyarՀայերենIndonesiaItaliano日本語ქართულიҚазақ한국어КыргызчаLietuviųLatviešuМакедонскиMelayuမြန်မာNederlandsNorskPolskiRomânăРусскийසිංහලSlovenčinaSlovenščinaShqipСрпскиSrpskiSvenskaKiswahiliТоҷикӣไทยTürkmenTürkçeЎзбекOʻzbekTiếng Việt
Nós usamos cookies para o funcionamento do site, análises e personalização. O processamento de dados é realizado de acordo com a Política de Privacidade.
aceitar todas configurar rejeitar