Liigu sisuni

Ekraanisuuruse tuvastaja

Selgita välja oma seadme vaateava suurus, ekraanilahutus, pikslite tihedssuhe ja orientatsioon. Tasuta, 100% brauseris.

Vaateava vs ekraanilahutus — mis on vahe?

Vaateava on veebilehe nähtav ala brauseri akna sees, mõõdetuna CSS-pikslites (window.innerWidth × window.innerHeight). See muutub, kui muudad brauseri akna suurust või avad DevTools. Ekraanilahutus on sinu füüsilise ekraani pikslite koguarv (screen.width × screen.height) — see on fikseeritud sinu riistvara ja ekraaniseadete poolt. Reageeriva veebi disaini jaoks on oluline vaateava — see määrab, millised CSS meediapäringud ja murrupunktid on aktiivsed.

Mis on seadme pikslite tihedussuhe (DPR)?

Seadme pikslite tihedussuhe (DPR) ütleb, mitu füüsilist (riistvara) pikslit vastab ühele CSS-pikslile. DPR 1 tähendab 1:1 kaardistust (standardekraanid). DPR 2 tähendab Retina/HiDPI-ekraani — iga CSS-piksel renderdatakse 4 füüsilise piksliga (2×2), tootes teravama teksti ja pildid. DPR 3 on levinud tippklassi nutitelefonidel. See on oluline: @2x/@3x piltide esitamine kõrge DPR-iga ekraanidele, mõistmine, miks ekraanitõmmised Retina-ekraanidel on oodatust kaks korda suurema lahutusega, ja küljendusprobleemide silumine, mis ilmnevad ainult konkreetsetel DPR-väärtustel.

Ekraani tuvastamise kasutusalad

Reageeriva disaini testimine — kontrolli, et CSS-murrupunktid käivituvad õigel vaateava laiusel ilma DevToolsi avamata. Vigade raportid — jaga täpseid vaateava mõõtmeid, ekraanilahutust ja DPR-i kuvamisprobleemide raporteerimisel arendajatele. Ekraanitõmmiste planeerimine — tea täpseid mõõtmeid enne ekraanitõmmiste tegemist dokumentatsiooni või äpipoe kirjete jaoks. Reklaami ja bänneri suurus — kontrolli, et vaateava mõõtmed vastavad nõutavatele reklaamikoha suurustele ekraanireklaamide jaoks.

Privaatsus

Kõik mõõtmised tehakse 100% kohalikult brauseris. Andmeid ei saadeta ühelegi serverile.