What is meta viewport in HTML?

What is meta viewport in HTML?

The viewport is the user’s visible area of a web page. It varies with the device – it will be smaller on a mobile phone than on a computer screen. You should include the following element in all your web pages:

Where do I put a viewport meta tag in HTML?

Throw the viewport meta tag into your , plus the @viewport rule into your CSS when you’re building flexible layouts and you’re good to go.

How do you make a viewport in HTML?

Setting The Viewport The width=device-width part sets the width of the page to follow the screen-width of the device (which 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.

Why is a viewport important in HTML?

A viewport makes sure a site display well on all device (mobile phones, tablets, computers, and even larger screens). In a nutshell, viewport plays a significant role in designing responsive and mobile-friendly websites.

Where does viewport go?

Definition. Viewport is a meta tag located in the of the HTML. It’s the visible part of a web page that a user can see from their device or monitor. Incorrect viewports will result in users having to side-scroll while browsing the website instead of the site fitting perfectly on their device screens.

What is viewport in HTML?

When designing websites, the viewport is an HTML meta tag (or @ rule in CSS) that is used to set styles and other website attributes to render the site on different devices. The viewport tag is used in conjunction with: Viewport Height & Width: Height (device-height value) or width (device-width values) to define the height or width of the viewport.

What are HTML meta keywords?

Meta Keywords are a specific type of meta tag that appear in the HTML code of a Web page and help tell search engines what the topic of the page is. Meta keywords are distinguished from regular keywords because they appear “behind the scenes,” in the source code of your page, rather than on the live, visible page itself. They look like this:

What is the purpose of the viewport meta tag?

The HTML Viewport meta tag is used for creating responsive website. So that web page can adjust its width according to viewport. It specifies the virtual viewport width of the device. It specifies the virtual viewport height of the device.

How do HTML meta tags work?

The metadata means information about data. The tag in HTML provides information about HTML Document or in simple words, it provides important information about a document. These tags are basically used to add name/value pairs to describe properties of HTML document , such as expiry date, author name, list of keywords, document author, etc. This tag is an empty element because it only has an opening tag and no closing tag but it carries information within its attributes.