CSS Media

CSS media used to make a page responsive. It adjusts content as per given device like mobile and not overload or cut the content. This allows you to apply a special CSS for mobile, or adjust a layout for print.

Basic syntax:

 // normal style

       #header-image {

            background-repeat: no-repeat;

            background-image:url('image.gif');

       }

But can also be called like this:

<link rel='stylesheet' media='all' href='normal.css' />

<link rel='stylesheet' media='print' href='print.css' />

<link rel='stylesheet' media='screen and (min-width: 701px)' href='medium.css' />

Powered  by Codersarts