Selektory ID

Lekcja 5 z 15 w kursie Selektory CSS w Coddy.

Selektor ID to rodzaj selektora CSS, który wybiera elementy mające określony atrybut ID. Atrybut ID to niestandardowy atrybut, który możesz dodać do elementów HTML, aby jednoznacznie je identyfikować.

Aby wybrać elementy z określonym ID, użyj symbolu kratki (#), po którym podaj wartość ID. Na przykład selektor #my-id wybiera element o ID my-id.

Oto przykład użycia selektora ID do stylizacji strony internetowej:

#my-id {
  color: red;
  font-size: 2em;
}

Aby dodać ID do elementu, napisz:

<div id="my-id"></div>

Podobnie jak selektory klas, ta reguła CSS sprawi, że element o ID my-id będzie czerwony i będzie miał rozmiar czcionki 2em.

Wyzwanie

Łatwy

Oto ćwiczenie sprawdzające Twoje zrozumienie selektorów ID:

Utwórz stronę internetową zawierającą dwa elementy div.
Nadaj pierwszemu elementowi div identyfikator my-id.
Użyj selektora ID, aby nadać elementowi div z identyfikatorem my-id dowolny kolor inny niż czarny oraz rozmiar czcionki 30px.

Spróbuj swoich sił

<html>
<head>
  <title>ID Selector Exercise</title>
  <style>
    /* CSS Code goes here */
  </style>
</head>
<body>
    
</body>
</html>

Wszystkie lekcje w sekcji Selektory CSS

1Wprowadzenie do selektorów CSS

Cel selektorów CSS Dlaczego są ważne?

4Selektory atrybutów

Wprowadzenie do selektorów atrybutów Obecność i dokładne wartości Selektory wartości atrybutu Selektory wartości atrybutu II Selektory wartości atrybutu III

2Proste selektory

Selektory typów Selektory klasSelektory IDSelektory uniwersalne

3Selektory kombinatorów

Selektor potomka bezpośredniego Selektor potomka Selektor sąsiedniego rodzeństwa Selektor ogólnego rodzeństwa

Poćwicz samodzielnie: Edytor online Web