Jak používat
- Pro změnu velikosti zadejte poměr (například 16 a 9) nebo vyberte běžný poměr a poté zadejte šířku nebo výšku. Druhý rozměr se dopočítá.
- Pro zjištění poměru zadejte šířku a výšku obrázku, obrazovky nebo videa.
- Zkontrolujte náhled a zkopírujte pravidlo CSS aspect-ratio, pokud ho potřebujete pro webový layout.
Jak to funguje
Proporcionální změna velikosti vychází ze vzorce výška = šířka × výška poměru ÷ šířka poměru (a naopak). Velikosti v pixelech jsou obvykle celá čísla, takže výsledek lze zaokrouhlit; pokud poměr nevychází přesně, například 16:9 při šířce 1000, je zaokrouhlená výška (563) spíše blízkým odhadem než přesnou hodnotou.
Velikost se zjednodušuje vydělením obou stran jejich největším společným dělitelem: 1920 a 1080 mají společného dělitele 120, takže vznikne 16:9. Některé reálné velikosti se nezjednoduší na známý poměr. 1366×768 je přesně 683:384, což je velmi blízko 16:9, a proto nástroj zobrazí i nejbližší běžný poměr, pokud se liší do 2 %. Stejně tak monitory „21:9“ jsou ve skutečnosti 64:27 (2560×1080) nebo 43:18 (3440×1440); 21:9 je marketingové označení.
V CSS vlastnost aspect-ratio: 16 / 9 zajistí, že si prvek zachová tvar i při změně šířky. Hodí se to pro vložená videa a zástupné obrázky, které při načítání nemají posouvat rozvržení stránky.
Příklady
Velikost miniatury videa
Miniatura 16:9, která musí být široká 1280 pixelů, musí být vysoká 720 pixelů.
Zjištění poměru stran obrazovky
2560×1600 se zjednoduší na 8:5, což je totéž jako 16:10, běžné u notebooků.
Portrétní ořez pro sociální sítě
Při poměru 4:5 a šířce 1080 je výška 1350, tedy portrétní velikost, kterou podporuje mnoho feedů.
Časté dotazy
Je 16:9 totéž jako 1.78:1?
Ano. 16 ÷ 9 ≈ 1.778, takže oba popisují stejný tvar. Filmové formáty se často uvádějí jako desetinná čísla, například 2.39:1.
Proč má můj výsledek desetinná místa?
Ne každá šířka se dá daným poměrem dělit beze zbytku. Zapněte zaokrouhlování na celé pixely; výsledkem pak bude nejbližší celý pixel, který se může od přesného poměru lišit o zlomek pixelu.
Funguje vlastnost CSS aspect-ratio všude?
Podporují ji všechny aktuální hlavní prohlížeče. Pokud má prvek zároveň explicitně nastavenou šířku i výšku, mají tyto hodnoty přednost před aspect-ratio.
Soukromí
Všechny výpočty probíhají ve vašem prohlížeči. Nic se nikam neodesílá ani neukládá.