Responsywne obrazy pozwalają przeglądarce wybrać **najlepszy obraz dla urządzenia** — oszczędzając przepustowość na telefonach i dostarczając ostre obrazy na ekranach high-DPI. ## srcset + sizes — ten sam obraz, różne rozdzielczości ```html A landscape

``` - **`srcset`** wyświetla obrazy kandydujące wraz z ich **szerokościami rzeczywistymi** (`400w` = 400px szerokości). - **`sizes`** mówi przeglądarce, jak szeroki będzie obraz *wyświetlany* w różnych punktach przerwania (tutaj: pełna szerokość okna przeglądarki poniżej 600px, w przeciwnym razie połowa). - Przeglądarka łączy `sizes` + gęstość pikseli urządzenia, aby wybrać najmniejszy obraz, który wciąż wygląda ostro — *zanim* cokolwiek pobierze. Telefon może wybrać `small.jpg`; laptop Retina wyświetlający go z szerokością 50% może wybrać `large.jpg`. ## picture — kierowanie artystyczne / różne formaty ```html

``` Przeglądarka używa **pierwszego** ``, który wspiera/pasuje. Użyj `

HTML pytań