Menu
Coddy logo textTech

Stylizacja elementów listy

Lekcja 11 z 12 w kursie Dolny pasek nawigacyjny – projekt HTML/CSS w Coddy.

Dodajmy style dla elementów listy; dzięki temu będziesz w stanie odpowiednio dostosować ikony.

challenge icon

Wyzwanie

Łatwy

Wybierz elementy listy z klasy nawigacyjnej i listy nieuporządkowanej .navigation ul li:

  1. Ustaw wysokość i szerokość na 35px, a margines na 1rem.
  2. Ustaw dopełnienie na 0 1rem.
  3. Ustaw kolor na dowolny! (zalecany: white)
  4. Ustaw promień obramowania na 50%.
  5. Ustaw display na flex, a align-items i justify-content na center.
  6. Dodaj poniższy styl:

    cursor: pointer;
    transition: all 0.2s linear;

Spróbuj swoich sił

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="styles.css">
</head>
    <body>
        <!-- Wpisz tutaj kod HTML -->
        <script src="script.js"></script>
    </body>
</html>

Wszystkie lekcje w sekcji Dolny pasek nawigacyjny – projekt HTML/CSS

Poćwicz samodzielnie: Edytor online Web