Spraw, aby układ CSS przetrwał prawdziwą treść

Cztery zbiory wyjaśnień CSS pozwalających zrozumieć ograniczenia układu, elastyczne rozmiary i niewygodne przypadki, które może ukryć idealna makieta.

Układ nie jest ukończony, jeśli pasuje do jednego zrzutu ekranu. Prawdziwy test pojawia się z dłuższym tytułem, mniejszą liczbą kart, wąskim ekranem lub inną czcionką. Ci autorzy wyjaśniają CSS za pomocą przykładów i rozumowania wizualnego. Użyj ich, aby zbadać ograniczenie, które możesz odtworzyć zamiast zbierać deklaracje bez zrozumienia, co one zmieniają.

Spróbuj najpierw tego

Utwórz mały przykład z krótkim, długim tytułem i nieprzerwanym ciągiem znaków. Zmień jego rozmiar przed zmianą CSS. Wybierz jeden artykuł wyjaśniający awarię, zastosuj najmniejszy odpowiedni pomysł i przetestuj ponownie z brakującymi obrazami i powiększonym tekstem. Zachowaj notatki na temat ograniczenia, aby następna poprawka go nie cofnęła.

Pamiętaj

Przykłady artykułów mogą być przeznaczone dla innej przeglądarki bazowej. Sprawdź obsługę konkretnej funkcji i zachowaj odpowiednią opcję zastępczą. Kompaktowy fragment kodu nie jest automatycznie bardziej odporny niż dłuższa i bardziej przejrzysta reguła układu.