Näyttökokotunnistin
Selvitä laitteesi näyttöportin koko, näyttötarkkuus, pikselitiheyssuhde ja suunta. Ilmainen, 100% selaimessa.
Viite
Näyttöportti vs näyttötarkkuus — mikä on ero?
Näyttöportti on verkkosivun näkyvä alue selainikkunan sisällä, mitattuna CSS-pikseleissä (window.innerWidth × window.innerHeight). Se muuttuu, kun muutat selaimen kokoa tai avaat DevToolsin. Näyttötarkkuus on fyysisen näyttösi pikselien kokonaismäärä (screen.width × screen.height) — tämä on laitteiston ja näyttöasetusten määräämä kiinteä arvo. Responsiivisessa web-suunnittelussa näyttöportti on se, mikä merkitsee — se määrittää, mitkä CSS-mediakyselyt ja murtumapisteet ovat aktiivisia.
Mikä on pikselitiheyssuhde (DPR)?
Pikselitiheyssuhde (DPR) kertoo, kuinka monta fyysistä (laitteiston) pikseliä vastaa yhtä CSS-pikseliä. DPR 1 tarkoittaa 1:1-vastaavuutta (tavalliset näytöt). DPR 2 tarkoittaa Retina/HiDPI-näyttöä — jokainen CSS-pikseli renderöidään 4 fyysisellä pikselillä (2×2), tuottaen terävämpää tekstiä ja kuvia. DPR 3 on yleinen huippuälylurikoissa. Tällä on merkitystä: @2x/@3x-kuvien toimittamiseen korkean DPR:n näytöille, sen ymmärtämiseen miksi kuvakaappaukset Retina-näytöillä ovat kaksinkertaisia odotettua tarkkuutta, ja asetteluongelmien debuggaamiseen, jotka esiintyvät vain tietyillä DPR-arvoilla.
Näyttökoon tunnistuksen käyttötapaukset
Responsiivisen suunnittelun testaus — varmista, että CSS-murtumapisteet laukeavat oikeilla näyttöportin leveyksillä avaamatta DevToolsia. Virheraportit — jaa tarkat näyttöportin mitat, näyttötarkkuus ja DPR raportoidessasi näyttöongelmia kehittäjille. Kuvakaappausten suunnittelu — tunne tarkat mitat ennen dokumentaation tai sovelluskaupan listauksen kuvakaappausten ottamista. Mainos- ja bannerikoot — varmista, että näyttöportin mitat vastaavat vaadittujen mainospaikkakokoja display-mainontaa varten.
Tietosuoja
Kaikki mittaukset tehdään 100% paikallisesti selaimessa. Tietoja ei lähetetä millekään palvelimelle.