Quais são os seletores de atributos em CSS?

Os seletores de atributos em CSS permitem selecionar elementos com base nos seus atributos e valores. Os principais tipos de seletores de atributos:

1. [atributo] - Seleciona todos os elementos que têm um atributo especificado, independentemente do seu valor.

   /* Seleciona todos os elementos com o atributo "title" */
   [title] {
     color: blue;
   }
   

2. [atributo="valor"] - Seleciona todos os elementos cujo atributo especificado tem um valor exato.

   /* Seleciona todos os links cujo atributo "href" é igual a "https://example.com" */
   a[href="https://example.com"] {
     text-decoration: none;
   }
   

3. [atributo~="valor"] - Seleciona todos os elementos cujo atributo especificado contém um valor dado como uma palavra separada por espaços.

   /* Seleciona elementos com a classe "highlight" */
   [class~="highlight"] {
     background-color: yellow;
   }
   

4. [atributo|="valor"] - Seleciona todos os elementos cujo atributo especificado é exatamente igual ao valor dado ou começa com esse valor seguido de um hífen (-). Usado principalmente para atributos de idioma (lang) ou prefixos.

   /* Seleciona elementos com o atributo lang="en" ou lang="en-US" */
   [lang|="en"] {
     font-style: italic;
   }
   

5. [atributo^="valor"] - Seleciona todos os elementos cujo atributo começa com o valor dado.

   /* Seleciona todos os links que começam com "https://" */
   a[href^="https://"] {
     color: green;
   }
   

6. [atributo$="valor"] - Seleciona todos os elementos cujo atributo termina com o valor dado.

   /* Seleciona todos os links que terminam em ".pdf" */
   a[href$=".pdf"] {
     font-weight: bold;
   }
   

7. [atributo*="valor"] - Seleciona todos os elementos cujo atributo contém o valor dado em qualquer parte da cadeia.

   /* Seleciona todos os links que contêm "example" na sua direção */
   a[href*="example"] {
     border: 1px solid black;
   }
   

Estes seletores podem ser combinados com outros tipos de seletores (por tag, classe, ID, etc.) para criar regras mais específicas.