Z kursu: Podstawowe szkolenie w zakresie HTML

Aby odblokować ten kurs, skorzystaj z bezpłatnej próbnej subskrypcji

Dołącz dzisiaj, aby uzyskać dostęp do ponad 24 000 kursów prowadzonych przez ekspertów w branży.

Zdjęcia responsywne

Zdjęcia responsywne – HTML: przewodnik

Z kursu: Podstawowe szkolenie w zakresie HTML

Zacznij mój 1. bezpłatny miesiąc Kup dla mojego zespołu

Zdjęcia responsywne

“

- W ostatnich dwóch filmach pokazałem ci źródło ustawione w atrybucie rozmiarów dla elementu obrazu i jak można ich użyć do dostarczenia wielu plików graficznych do przeglądarki i pozwolić jej zdecydować, który z nich załadować i wyświetlić. We wszystkich tych przykładach sam obraz, zdjęcie psa było tą samą fotografią. Zapisano tyle różnych kopii z większą liczbą pikseli lub mniejszą liczbą pikseli, ale zawartość zdjęcia była taka sama przez cały czas. Sposób, w jaki został przycięty, jego proporcje. Ale co, jeśli chcemy zrobić coś więcej niż zamienić plik o niskiej rozdzielczości na plik o wysokiej rozdzielczości? Co zrobić, jeśli chcemy użyć innego obrazu na małym ekranie niż na dużym ekranie? Może chcemy, aby obraz był wysoki i wąski na telefonie komórkowym, gdzie jest krótki i szeroki na komputerze. Lub nawet użyj zupełnie innego zdjęcia. Spójrzmy na inny przykład. Co powiesz na to, że to zdjęcie, na dużych ekranach, pokaże część pola i całe jej ciało, ale na małych ekranach…

Spis treści