welcome to tutorialfamily

html media

HTML media is define in @media (max-width:value;)

Html media used for responsive layout.

Using media query you can build mobile friendly web pages.

html media query

use media in external style-sheet.

example



<!DOCTYPE html>
<html>
	<head>
		<title>
			media demo
		</title>
		<style>
			@media (max-width:1600px) {
				p{
					font-size: 50px;
				}
			}
			@media (max-width:1199px) {
				p{
					font-size: 40px;
				}
			}
			@media (max-width:991px) {
				p{
					font-size: 30px;
				}
			}
			@media (max-width:767px) {
				p{
					font-size: 20px;
				}
			}
			@media (max-width:543px) {
				p{
					font-size: 18px;
				}
			}
		</style>
		</head>
	
<body>
    <p>this is my car</p>
</body>
</html>


Run

Our Content