media.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .container{
            background-color: red;
            height: 34vh;
        }
        @media screen and (max-width:800px) {
            body{
                background-color: rgb(0, 38, 255);
            }
            .container{
                background-color: yellow;
            }
        }
    </style>
</head>
<body>
    <div class="container">Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolore suscipit aut ex dolor enim cupiditate blanditiis, sapiente dignissimos culpa totam? Ducimus eaque, atque, repellat voluptatibus cum magnam recusandae laudantium facere totam minima sapiente iusto?</div>
</body>
</html>