tigtools

Jaké je moje rozlišení obrazovky

Velikost vaší obrazovky, okna prohlížeče a podrobnosti o displeji načtené přímo z vašeho prohlížeče. Velikost viewportu se aktualizuje při změně velikosti okna.

Běží ve vašem prohlížeči Bez registrace

Načítání údajů o displeji…

Jak používat

  1. Otevřete stránku. Hodnoty se okamžitě načtou z vašeho prohlížeče.
  2. Změňte velikost okna nebo otočte zařízení a uvidíte aktualizovanou velikost viewportu a orientaci.
  3. Pomocí „Kopírovat vše“ vložte podrobnosti do hlášení chyby nebo žádosti o podporu.

Jak to funguje

Prohlížeče uvádějí rozměry v pixelech CSS, tedy v jednotce, kterou webové stránky používají pro rozvržení. Na displejích s vysokým rozlišením se jeden pixel CSS vykresluje několika fyzickými pixely: poměr pixelů zařízení (DPR) říká, kolika. Telefon, který hlásí 390 × 844 s DPR 3, má panel s přibližně 1170 × 2532 fyzickými pixely. Na počítači mění DPR i velikost v pixelech CSS přiblížení prohlížeče a škálování displeje v operačním systému, takže monitor 2560 × 1440 při 125 % škálování hlásí 2048 × 1152.

Rozlišení obrazovky je celý displej; dostupný prostor nezahrnuje trvalé lišty operačního systému, jako je hlavní panel Windows nebo řádek nabídek macOS; viewport je část okna prohlížeče, kde se stránka zobrazuje, bez panelů nástrojů, ale včetně případného posuvníku. Na viewport reagují dotazy CSS, jako je min-width: 768px, takže je to hodnota, kterou je třeba zkontrolovat při testování responzivních rozvržení.

Barevné schéma a hodnoty omezení pohybu pocházejí ze stejných mediálních funkcí CSS, které weby používají k přizpůsobení se nastavení vašeho systému. Značka, platforma a mobilní zařízení pocházejí z User-Agent Client Hints, které poskytují pouze prohlížeče založené na Chromiu. Některé prohlížeče tyto hodnoty záměrně zaokrouhlují nebo upravují, aby omezily fingerprinting, takže nemusí přesně odpovídat vašemu hardwaru.

Příklady

Testování responzivního layoutu

Rozvržení se rozbije na notebooku kolegy. Zkopírují podrobnosti, které ukazují viewport 1280 × 649 při DPR 1.5. Nastavte panel zařízení v prohlížeči na stejný viewport a problém reprodukujte.

Volba velikostí obrázků

Produktový obrázek se zobrazuje v šířce 400 pixelů CSS. Na telefonu s DPR 3 potřebuje 1200 pixelů, aby byl ostrý, což napovídá, jaké velikosti uvést v srcset.

Kontrola škálování monitoru

Monitor 3840 × 2160 hlásí 2560 × 1440 s DPR 1.5: Windows škáluje displej na 150 %.

Časté dotazy

Proč se rozlišení obrazovky liší od specifikace mého monitoru?

Prohlížeče hlásí CSS pixely, což jsou fyzické pixely vydělené koeficientem škálování. Vynásobte hodnotu poměrem pixelů zařízení (device pixel ratio) a přiblížíte se hardwarovému rozlišení. Přiblížení stránky také změní hlášenou hodnotu.

Jaký je rozdíl mezi velikostí obrazovky a velikostí viewportu?

Velikost obrazovky je celý displej. Viewport je pouze oblast uvnitř okna prohlížeče, kde se vykresluje stránka, takže je menší a mění se, když změníte velikost okna nebo otevřete vývojářské nástroje.

Používají se tyto informace k mému sledování?

Tato stránka je nepoužívá: hodnoty se pouze zobrazí vám a nikam se neukládají ani neodesílají. Webové stránky ale mohou číst stejné hodnoty, a proto je některé prohlížeče zaokrouhlují, aby ztížily vytváření otisku prohlížeče.

Proč se na mém notebooku zobrazuje podpora dotyku?

Podpora dotyku vychází z počtu dotykových bodů, které prohlížeč hlásí. Notebooky s dotykovou obrazovkou je hlásí, i když používáte hlavně myš, a některé ovladače nebo nastavení vzdálené plochy hlásí podporu dotyku i bez dotykové obrazovky.

Soukromí

Všechny hodnoty načítá JavaScript ve vašem prohlížeči a zobrazují se pouze vám. Nic se neukládá, nenahrává ani nezahrnuje do analýz; zaznamenává se pouze anonymní událost, že byl nástroj otevřen a použit.