Funkcja attr

Funkcja attr pozwala uzyskać w CSS wartość atrybutu znacznika HTML.

Składnia

cssselektor {
  właściwość: attr(nazwa, typ, wartość);
}

Parametry

Parametr Opis
nazwa Nazwa atrybutu elementu przekazywana do CSS.
typ Typ wartości właściwości CSS. Dopuszczalne są następujące słowa kluczowe: string (ciągi znaków), color (kolor), url (adres internetowy), integer (liczba całkowita), number (liczba rzeczywista), angle (kąt), time (czas), deg (stopień), oraz jednostki CSS takie jak em, px i inne.
wartość Wartość, która zostanie użyta w przypadku, gdy atrybut nie istnieje lub przeglądarka nie może go uzyskać.

Przykład

Dodajmy po tekście linku wartość jego atrybutu href w nawiasach okrągłych:

html<a href="http://google.com">link</a>
cssa::after {
  content: ' (' attr(href) ')';
}

Результат:

Zobacz też

  • właściwość content,
    która pozwala dodawać tekst do elementów
  • pseudoelement before,
    który wykonuje wstawienie po tekście znacznika
  • pseudoelement after,
    który wykonuje wstawienie przed tekstem znacznika