Viewport meta tag is the primary idea of Responsive Web Design. The viewport differs from device to device. It will be smaller on a mobile when contrasted with PC screen.

To set the viewport, HTML5 presented a technique  <meta> tag, to permit developers to take control over the viewport.

It is compulsory to include <meta> viewport element in all your web pages.

<meta name="viewport" content="width=device-width, initial-scale=1.0">

A <meta> viewport element control the page's  measurements and scaling.

The width=device-width part sets the width of the page to follow the screen-width of the device (this will vary depending on the device).

The initial-scale=1.0 part sets the initial zoom level when the page is first loaded by the browser.

CSS viewport rule :- 

1. Try not to utilize fixed width elements.

2. Substance ought not depend on a specific viewport width to render well. 

3. Utilize CSS media queries to apply diverse styling for small and large screens

Following is the list of viewport properties :-