Przejdź do głównej treści

Kwalifikacja: INF.03 - Tworzenie i administrowanie stronami i aplikacjami internetowymi oraz bazami danych

Zawód: Technik informatyk, Technik programista

Kategorie: Tworzenie stron WWW Systemy CMS i narzędzia webowe

Na rysunku przedstawiono projekt układu bloków witryny internetowej. Zakładając, że bloki są realizowane za pomocą znaczników sekcji, ich formatowanie w CSS, oprócz ustawionych szerokości bloków 1, 2, 4 i 5 (blok 3 nie ma ustawionej szerokości), powinno zawierać właściwość

BLOK 1BLOK 2
BLOK 3
BLOK 4BLOK 5
A. float: left dla wszystkich bloków
B. clear: both dla wszystkich bloków
C. clear: both dla bloku 3 oraz float: left tylko dla bloków 1 i 2
D. clear: both dla bloku 3 oraz float: left dla pozostałych bloków
Właściwe formatowanie to: clear: both dla bloku 3 oraz float: left dla pozostałych bloków. Właściwość float: left powoduje, że elementy z ustaloną szerokością ustawiają się obok siebie od lewej strony, jeśli jest na to miejsce. Dlatego bloki 1 i 2 tworzą górny wiersz, a bloki 4 i 5 dolny wiersz. Blok 3 ma przełamać układ i znaleźć się pod oboma wcześniejszymi elementami pływającymi, dlatego otrzymuje clear: both. Ponieważ nie ma ustawionej szerokości i nie jest pływający, jako element blokowy zajmuje dostępną szerokość kontenera. Do zapamiętania: float ustawia element obok innych, a clear: both zabrania sąsiedztwa pływających elementów po lewej i prawej stronie.
W tym układzie sama szerokość elementów nie wystarcza do ustawienia ich w dwóch kolumnach. float: left dla wszystkich bloków spowodowałoby, że także blok 3 stałby się elementem pływającym. Bez ustawionej szerokości nie pełniłby roli pełnego poziomego pasa rozdzielającego górny i dolny wiersz. clear: both dla wszystkich bloków działa odwrotnie niż potrzeba - każdy blok odsuwa się poniżej wcześniejszych elementów pływających, więc układ nie tworzy par bloków obok siebie. clear: both dla bloku 3 oraz float: left tylko dla bloków 1 i 2 poprawnie tworzy górny wiersz i środkowy blok, ale bloki 4 i 5 pozostają zwykłymi elementami blokowymi, więc nie ustawią się obok siebie. Poprawne jest clear: both dla bloku 3 oraz float: left dla pozostałych bloków. Typowy błąd polega na założeniu, że ustawiona szerokość automatycznie układa elementy w kolumnach, bez użycia float.

Wymagane logowanie

Ocenianie trudności pytań jest dostępne tylko dla zalogowanych użytkowników. Zaloguj się, aby skorzystać z pełni możliwości platformy.

Twoja ocena pomoże innym uczniom w przygotowaniu do egzaminu, a Tobie pozwoli na dostęp do spersonalizowanych statystyk.

Zgłoś błąd w pytaniu

Rozwiń sekcję i zmień pole, którego dotyczy błąd. Wysłane zostaną tylko zmienione sekcje.

Błędna kwalifikacja
Błąd w treści pytania
Błąd w treści odpowiedzi
Błąd w obrazie
Dane kontaktowe (opcjonalnie)
Podaj email, jeśli chcesz otrzymać informację o rozpatrzeniu zgłoszenia.