Jeg pleier å bruke dette:
Selv om jeg ser at dette anbefales mye:
Dette betyr at nettleseren (sannsynligvis) gjengir bredden på siden i bredden på sin egen skjerm. Så hvis skjermen er 320px bred, vil nettleservinduet være 320px bredt, i stedet for å zoome ut og vise 960px (eller hva den enheten gjør som standard, i stedet for en responsiv metakode).
Merk: Ikke bruk en responsiv metakode hvis nettstedet ditt ikke er spesielt designet for å være responsivt og fungerer bra i den størrelsen, da det vil gjøre opplevelsen verre.
Det er flere attributter denne koden støtter:
| Eiendom | Beskrivelse |
|---|---|
| bredde | Bredden på det virtuelle visningsområdet til enheten. |
| enhetsbredde | Den fysiske bredden på enhetens skjerm. |
| høyde | Høyden på det "virtuelle visningsområdet" på enheten. |
| enhetshøyde | Den fysiske høyden på enhetens skjerm. |
| innledende skala | Den første zoomingen når du besøker siden. 1.0 zoomer ikke. |
| minimumsskala | Minimumsbeløpet den besøkende kan zoome på siden. 1.0 zoomer ikke. |
| maksimal skala | Maksimumsbeløpet besøkende kan zoome på siden. 1.0 zoomer ikke. |
| bruker-skalerbar | Lar enheten zoome inn og ut. Verdiene er ja eller nei. |
Det anbefales generelt at du ikke forhindrer skalering, da det er irriterende og potensielt et tilgjengelighetsproblem.
Du vil sannsynligvis også ha dette i CSS:
@-ms-viewport( width: device-width; )Godt å vite: å endre verdien til denne metakoden med JavaScript fungerer, siden vil reagere på den nye verdien. Enten ut hele taggen og erstatte, eller endre contenteiendommen. Ikke et super vanlig behov, men det kan komme opp.