Czy zdarzyło Ci się stosować do elementu CSS, ale to po prostu nie działa?
Dzięki narzędziom deweloperskim w Chrome możesz szybko wykryć problemy związane z CSS, debugować je i przetestować.
Obejrzyj film, by dowiedzieć się, jak panel Elementy > Style wyróżnia różne problemy z CSS:
Usługa o nieprawidłowej składniZastąpiona właściwośćNieaktywna usługa
Odziedziczone z grupy
parent
- dziedziczona usługa
- niedziedziczona usługa
Rozwijana właściwość skrócona
-
Zastąpiona właściwość długa - Aktywna usługa długoterminowa
-
arkusz stylów klienta użytkownika
- Usługa, której nie można edytować
Zastąpiona właściwość, której nie można edytować
Więcej wskazówek dotyczących debugowania:
- Użyj filtra w panelu Style, aby skupić się na tej samej usłudze, która Cię interesuje.
- W panelu Obliczone możesz wyświetlić wszystkich zwycięzców w kategorii Kaskada wraz z ich obliczonymi wartościami.
- W panelu Obliczone rozwiń usługę i kliknij link, aby znaleźć jej źródło w panelu Style.
Więcej informacji o tym, jak Narzędzia deweloperskie wyróżniają problemy z CSS, znajdziesz w artykule Znajdowanie nieprawidłowych, zastąpionych, nieaktywnych i innych elementów CSS.
Jeśli chcesz poszerzyć swoją wiedzę o CSS, przeczytaj artykuł Informacje o CSS.
Aby dowiedzieć się, jak tworzyć strony, które wyglądają świetnie i są wygodne dla wszystkich, obejrzyj uczestniczenie w lekcjach projektowania responsywnego.