Mám tendenci používat toto:
I když vidím, že se to hodně doporučuje:
To znamená, že prohlížeč (pravděpodobně) vykreslí šířku stránky na šířku své vlastní obrazovky. Pokud je tedy tato obrazovka široká 320 pixelů, bude okno prohlížeče široké 320 pixelů, nikoli zvětšeno a zobrazeno 960 pixelů (nebo cokoli, co toto zařízení ve výchozím nastavení dělá, místo responzivní metaznačky).
Poznámka: Nepoužívejte responzivní metaznačku, pokud váš web není speciálně navržen tak, aby reagoval a fungoval dobře v této velikosti, protože to zhorší zážitek.
Tato značka podporuje více atributů:
| Vlastnictví | Popis |
|---|---|
| šířka | Šířka virtuálního výřezu zařízení. |
| šířka zařízení | Fyzická šířka obrazovky zařízení. |
| výška | Výška „virtuálního výřezu“ zařízení. |
| výška zařízení | Fyzická výška obrazovky zařízení. |
| počáteční měřítko | Počáteční přiblížení při návštěvě stránky. 1.0 nezvětšuje. |
| minimální měřítko | Minimální částka, kterou může návštěvník stránku přiblížit. 1.0 nezvětšuje. |
| maximální měřítko | Maximální částka, kterou může návštěvník stránku přiblížit. 1.0 nezvětšuje. |
| škálovatelné uživatelem | Umožňuje zařízení přiblížit a oddálit. Hodnoty jsou ano nebo ne. |
Obecně se doporučuje, abyste nezabránili škálování, protože je to nepříjemné a potenciálně problém s přístupností.
Pravděpodobně to budete chtít také ve svém CSS:
@-ms-viewport( width: device-width; )Dobré vědět: změna hodnoty této metaznačky pomocí JavaScriptu funguje, stránka bude reagovat na novou hodnotu. Vyjměte celou značku a nahraďte ji nebo změňte contentvlastnost. Není to příliš běžná potřeba, ale může přijít.