Uit de cursus: Basistraining HTML

Krijg toegang tot deze cursus met een gratis proefabonnement

Word vandaag lid en krijg toegang tot meer dan 24.200 cursussen geleid door branchedeskundigen.

Responsieve breedte

Responsieve breedte - tutorial HTML

Uit de cursus: Basistraining HTML

Gratis proefversie van 1 maand starten Aanschaffen voor mijn team

Responsieve breedte

“

- In de laatste video hebben we net gekeken hoe we het afbeeldingselement en het srcset-attribuut kunnen gebruiken om een reeks afbeeldingsbestanden weer te geven en de browser te laten beslissen welk bestand moet worden gedownload en weergegeven, rekening houdend met de pixeldichtheid van het scherm. Wat als we in plaats daarvan willen dat de browser rekening houdt met de breedte van de viewport en een bestand kiest op basis van de grootte van het scherm en de dichtheid? Laten we eens kijken naar een demo. Het lijkt erg op degene die ik zojuist in de laatste video liet zien met vier afbeeldingen in een srcset-attribuut. Maar deze keer in plaats van één x, twee x, drie x, vier x te zeggen, zullen we de browser vertellen hoe breed elk bestand is, 480w, 960w. Dat betekent 480 pixels breed, 960 pixels breed. Nu kiest de browser dynamisch welke afbeelding moet worden weergegeven op basis van een combinatie van apparaatdichtheid en viewportbreedte. Dit gaat niet de juiste grootte…

Inhoud