Responsive font-size/weight

Question

I can make my images/divs responsive by using percentages.

How can I make the font-size responsive to different screen sizes?

Answer 1

You can use CSS3 vh, vw,vmin and vmax new values for responsive font.

1vw = 1% of viewport width

1vh = 1% of viewport height

1vmin = 1vw or 1vh, whichever is smaller

1vmax = 1vw or 1vh, whichever is larger

h1 {
font-size: 5.9vw;
}
h2 {
font-size: 3.0vh;
}
p {
font-size: 2vmin;
}