Slik bruker du det
- For å skalere angir du forholdet (for eksempel 16 og 9) eller velger et vanlig forhold, og deretter skriver du inn en bredde eller en høyde. Den andre siden beregnes.
- For å finne et sideforhold, skriv inn bredden og høyden på et bilde, en skjerm eller en video.
- Sjekk forhåndsvisningen og kopier CSS-regelen for aspect-ratio hvis du trenger den til et weboppsett.
Slik fungerer det
Proporsjonal skalering bruker høyde = bredde × forholdshøyde ÷ forholdsbredde (og omvendt). Pikselstørrelser er vanligvis hele tall, så resultatet kan avrundes; når et forhold ikke går opp, for eksempel 16:9 ved bredde 1000, er den avrundede høyden (563) en nær tilnærming i stedet for et eksakt samsvar.
En størrelse forenkles ved å dele begge sider på største felles divisor: 1920 og 1080 deler 120, noe som gir 16:9. Noen faktiske størrelser reduseres ikke til et velkjent forhold. 1366×768 er nøyaktig 683:384, som er svært nær 16:9, så verktøyet viser også det nærmeste vanlige forholdet når det er innenfor 2 %. På samme måte er «21:9»-skjermer egentlig 64:27 (2560×1080) eller 43:18 (3440×1440); 21:9 er et markedsføringsnavn.
I CSS sørger aspect-ratio: 16 / 9 for at et element beholder formen når bredden endres. Dette er nyttig for innebygde videoer og bildeplassholdere som ikke skal forskyve layouten under innlasting.
Eksempler
Videominiatyrstørrelse
Et 16:9-miniatyrbilde som skal være 1280 piksler bredt, trenger å være 720 piksler høyt.
Identifisere skjermens sideforhold
2560×1600 forenkles til 8:5, som er det samme som 16:10, vanlig på bærbare datamaskiner.
Portrettbeskjæring for sosiale medier
Med et 4:5-forhold og bredde 1080 blir høyden 1350, en stående størrelse mange feeder godtar.
Ofte stilte spørsmål
Er 16:9 det samme som 1,78:1?
Ja. 16 ÷ 9 ≈ 1,778, så de to beskriver samme form. Kinoformater oppgis ofte som desimaler, for eksempel 2,39:1.
Hvorfor har resultatet mitt desimaler?
Ikke alle bredder går opp i forholdet. Slå på avrunding for pikselstørrelser; resultatet blir da nærmeste hele piksel, som kan avvike med en brøkdel av en piksel fra det eksakte forholdet.
Fungerer CSS-egenskapen aspect-ratio overalt?
Den støttes i alle nåværende større nettlesere. Hvis et element også har både bredde og høyde angitt eksplisitt, har disse forrang over aspect-ratio.
Personvern
Alle beregninger kjøres i nettleseren din. Ingenting sendes eller lagres.