Wat is een beeldverhouding?

Een beeldverhouding is de proportionele relatie tussen de breedte en hoogte van een element, uitgedrukt als twee getallen gescheiden door een dubbele punt (bijv. 16:9 of 4:3). Het beschrijft de vorm van een rechthoek.

Hoe wordt de beeldverhouding berekend?

De beeldverhouding wordt berekend door beide dimensies te delen door hun Grootste Gemene Deler (GGD). Bijvoorbeeld 1920x1080: GGD(1920, 1080) = 120, dus 1920/120 = 16 en 1080/120 = 9, wat 16:9 oplevert.

Wat zijn de meest voorkomende beeldverhoudingen?

16:9 is de standaard voor breedbeeldvideo en de meeste moderne monitors. 4:3 was de standaard voor oudere TV's. 1:1 is vierkant, populair op Instagram. 21:9 is ultrabreed cinematografisch. 9:16 is staande oriëntatie voor Stories.

Wat is de CSS aspect-ratio eigenschap?

De CSS-eigenschap `aspect-ratio` stelt een voorkeurs-beeldverhouding in voor een element. Voorbeeld: `aspect-ratio: 16 / 9` behoudt 16:9-verhoudingen. Ondersteund in alle moderne browsers sinds 2021.

Hoe behoud ik de beeldverhouding bij het schalen van afbeeldingen in CSS?

Gebruik `object-fit: cover` of `object-fit: contain` op -elementen in een container met vaste afmetingen. Of gebruik `aspect-ratio: 16/9; width: 100%;` direct op de afbeelding of container.

Welke beeldverhouding voor social media?

Veelvoorkomende verhoudingen: Instagram feed = 1:1 of 4:5. Stories/Reels = 9:16. YouTube = 16:9. Twitter = 16:9. Facebook = 1.91:1. Pinterest = 2:3. Bij twijfel werkt 16:9 voor de meeste platforms.

Verschil tussen beeldverhouding en resolutie?

Resolutie verwijst naar de werkelijke pixelafmetingen (bijv. 1920x1080). Beeldverhouding is de proportionele relatie, onafhankelijk van grootte. Meerdere resoluties kunnen dezelfde verhouding delen: 1280x720, 1920x1080 en 3840x2160 hebben allemaal 16:9.

Aspect Ratio

Bereken en behoud beeldverhoudingen voor afbeeldingen, video's en schermen.

Automatische berekeningVeelgebruikte presetsVerhouding vergrendelen

① Voer breedte en hoogte in ② Of kies een preset ③ Kopieer de CSS

Standaard

Sociaal

Aangepaste verhouding:

Breedte (px)

Hoogte (px)

16:9

Beeldverhouding

16:9

Afmetingen

1920×1080

Decimale verhouding

1.7778

CSS-uitvoer

aspect-ratio: 16 / 9;
padding-top: 56.2500%; /* legacy fallback */
width: 1920px;
height: 1080px;

Ga verder met

▸Px naar RemCSS-eenheden converteren 64Base64 ToolCoderen en decoderen ↓SVG naar PNGVectorbestanden converteren

Wat is beeldverhouding en waarom is het belangrijk?

De beeldverhouding is de proportionele relatie tussen breedte en hoogte van een element, uitgedrukt als B:H — bijvoorbeeld 16:9, 4:3, 1:1 of 9:16. Het is fundamenteel voor videoproductie, fotografie en responsief webdesign. Moderne CSS past verhoudingen toe met de aspect-ratio-eigenschap (bijv. aspect-ratio: 16 / 9), ter vervanging van de oude padding-top-truc (padding-top: 56.25%). Veelgebruikte toepassingen: YouTube-thumbnails (1280×720, 16:9), Instagram-posts (1080×1080, 1:1), TikTok en Stories (1080×1920, 9:16), Open Graph-afbeeldingen (1200×630), LinkedIn-banners (1200×627).

Veelgestelde vragen

Beeldverhouding is de proportionele relatie tussen breedte en hoogte. Veelgebruikte verhoudingen: 16:9, 4:3, 1:1, 21:9, 9:16.

Hoogte = breedte × (verhouding hoogte ÷ verhouding breedte). Voorbeeld: 16:9 bij 1920px → 1080px.

16:9 is de standaard voor breedbeeldvideo, moderne monitoren en YouTube-thumbnails.

Moderne CSS: `aspect-ratio: 16 / 9`. Oudere browsers: `padding-top: 56.25%`.

Beeldverhouding is dimensieloos (bijv. 16:9). Resolutie is het werkelijke aantal pixels (1920×1080).

Gebruik in HTML5 width en height op <img>. Voeg max-width: 100%; height: auto toe in CSS.

Instagram-post: 1:1. Story/TikTok: 9:16. Twitter: 3:1. YouTube: 16:9 (1280×720). Open Graph: 1200×630.

Wat is beeldverhouding en waarom is het belangrijk?

Veelgestelde vragen

Ontdek ons netwerk