javascript - Re-size text for all media -


i know how re-size text depending on size of screen i've been researching , cant find different media sizes out there , trial , error getting exhausting. question is, 1 have resource or know different screen sizes?

@media(max-width:767px) {     body {         font-size: 10px;     }; }  @media(min-width:992px) {     body {         font-size: 14px;     }; }   @media(min-width:1200px) {     body {         font-size: 16px;     }; }  @media(min-width:2000px) {     body {         font-size: 30px;     }; } 

also, in case better use em on px or pc? solution compatible browsers? there better solution @media(min-width:2000px)?

thanks any/all feedback

as time goes on, number of device resolutions become infinite. best ignore fact there millions of devices different resolutions , make general assumptions on device resolutions in terms of wearable, mobile, tablet, desktop, retina/4k+.

if want target specific device resolutions i've found mildly helpful:

https://css-tricks.com/snippets/css/media-queries-for-standard-devices/

which covers examples of:

phones , handhelds

iphones

galaxy phones

htc phones

tablets

ipads

galaxy tablets

nexus tablets

kindle fire

laptops

retina

non-retina

wearables

apple watch

moto 360 watch

another great resource use if want emulate device resolutions use chrome devtools , use mobile emulation. specific instructions on how can found here:

https://developer.chrome.com/devtools/docs/device-mode


Comments

Popular posts from this blog

Email notification in google apps script -

c++ - Difference between pre and post decrement in recursive function argument -

javascript - IE11 incompatibility with jQuery's 'readonly'? -