Full Example of HTML Responsive Text Size

Resize the browser window to see how the text size scales. Use the "vw" unit when sizing the text. 10vw will set the size to 10% of the viewport width. Viewport is the browser window size. 1vw = 1% of viewport width. If the viewport is 50cm wide, 1vw is 0.5cm.

index.html

Example: HTML

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<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>

Output should be:

Type:	html
Category:	Web Tutorial
Sub Category:	HTML Responsive
Uploaded by:	Admin