How to set text size according to the browser window ?
By using “vw” unit you can set text size according to browser width. see the below code, add it to your html . now try to resize the your browser window. the text size will get adjusted automatically according to your browser screen width.
<!DOCTYPE html> <html> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <body> <h1 style="font-size:10vw;">Responsive Text</h1> <p style="font-size:5vw;">Resize the browser window to see how the text size scales.</p> <p style="font-size:5vw;">Use the "vw" unit when sizing the text. 10vw will set the size to 10% of the viewport width.</p> <p>Viewport is the browser window size. 1vw = 1% of viewport width. If the viewport is 50cm wide, 1vw is 0.5cm.</p> </body> </html>
Reference Site:- https://www.w3schools.com/html/html_responsive.asp
Share