Odzivna metaoznaka - CSS-triki

Anonim

Običajno uporabljam to:

Čeprav vidim, da se to veliko priporoča:

To pomeni, da bo brskalnik (verjetno) prikazal širino strani na širini lastnega zaslona. Torej, če je zaslon širok 320 slikovnih pik, bo okno brskalnika široko 320 slikovnih pik, namesto da bi se pomanjšalo in prikazalo 960 slikovnih pik (ali karkoli ta naprava privzeto počne namesto odzivne metaoznake).

Opomba: ne uporabljajte odzivne metaoznake, če vaše spletno mesto ni posebej zasnovano za odzivnost in dobro deluje pri tej velikosti, saj bo poslabšalo izkušnjo.

Ta oznaka podpira več atributov:

Nepremičnina Opis
premer Širina navideznega vidnega polja naprave.
širina naprave Fizična širina zaslona naprave.
višina Višina "navideznega vidnega polja" naprave.
višina naprave Fizična višina zaslona naprave.
začetna lestvica Začetni zoom med obiskom strani. 1.0 ne poveča.
minimalni obseg Najmanjši znesek, ki ga lahko obiskovalec poveča na strani. 1.0 ne poveča.
največji obseg Največji znesek, ki ga lahko obiskovalec poveča na strani. 1.0 ne poveča.
prilagodljivo za uporabnika Omogoča napravi, da poveča ali zmanjša. Vrednosti so da ali ne.

Običajno je priporočljivo, da ne preprečujete skaliranja, saj je to moteče in lahko povzroči težave z dostopnostjo.

Verjetno boste to želeli tudi v svojem CSS:

@-ms-viewport( width: device-width; )

Dobro je vedeti: če spremenite vrednost te metaoznake z JavaScriptom, se stran odzove na novo vrednost. Izvlecite celotno oznako in jo zamenjajte ali spremenite contentlastnost. Ni zelo pogosta potreba, vendar se lahko pojavi.