Jeg plejer at bruge dette:
Selvom jeg ser, anbefales det meget:
Dette betyder, at browseren (sandsynligvis) gengiver sidens bredde i bredden af sin egen skærm. Så hvis skærmen er 320 px bred, vil browservinduet være 320 pix bredt i stedet for mådezoomet ud og viser 960 pixel (eller hvad den enhed gør som standard i stedet for et responsivt metatag).
Bemærk: Brug ikke et responsivt metatag, hvis dit websted ikke er specifikt designet til at være lydhørt og fungerer godt i den størrelse, da det vil gøre oplevelsen værre.
Der er flere attributter, som dette tag understøtter:
| Ejendom | Beskrivelse |
|---|---|
| bredde | Bredden på enhedens virtuelle visningsport. |
| enhedsbredde | Den fysiske bredde på enhedens skærm. |
| højde | Højden af enhedens "virtuelle visningsport". |
| enhedens højde | Enhedens fysiske højde. |
| indledende skala | Den indledende zoom, når du besøger siden. 1.0 zoomer ikke. |
| minimumskala | Det mindste beløb, som den besøgende kan zoome på siden. 1.0 zoomer ikke. |
| maksimal skala | Det maksimale beløb, som den besøgende kan zoome på siden. 1.0 zoomer ikke. |
| bruger-skalerbar | Tillader enheden at zoome ind og ud. Værdier er ja eller nej. |
Det anbefales generelt, at du ikke forhindrer skalering, da det er irriterende og potentielt et tilgængelighedsproblem.
Du vil sandsynligvis også have dette i din CSS:
@-ms-viewport( width: device-width; )Godt at vide: at ændre værdien af dette metatag med JavaScript fungerer, siden reagerer på den nye værdi. Enten ud af hele tagget og udskift det, eller skift contentejendommen. Ikke et super almindeligt behov, men det kan komme op.