HMTL 5 interview

What Is doctype in html 5
All HTML documents must start with a declaration.The declaration is not an HTML tag. It is an "information" to the browser about what document type to expect. In HTML 5, the declaration is simple

What is difference between SVG and Canvas
The HTML svg element is a container for SVG graphics. SVG stands for Scalable Vector Graphics. SVG and useful for defining graphics such as boxes, circles, text, etc. SVG stands for Scalable Vector Graphics and is a language for describing 2D-graphics and graphical applications in XML and the XML is then rendered by an SVG viewer. Most of the web browsers can display SVG just like they can display PNG, GIF, and JPG. The HTML canvas element is used to draw graphics, via JavaScript. The canvas element is a container for graphics.

What is WebSocket
A WebSocket is a persistent connection between a client and server. WebSockets provide a bidirectional, full-duplex communications channel that operates over HTTP through a single TCP/IP socket connection. At its core, the WebSocket protocol facilitates message passing between a client and server.

What is geo location
HTML5 Geolocation. The Geolocation is one of the best HTML5 API which is used to identify the user's geographic location for the web application. This new feature of HTML5 allows you to navigate the latitude and longitude coordinates of the current website's visitor
What is Canvas

Tell me about What is Multimedia?tag
Multimedia comes in many different formats. It can be almost anything you can hear or see, like images, music, sound, videos, records, films, animations, and more. Web pages often contain multimedia elements of different types and formats. Note: MP4, WebM, and Ogg video are supported by the HTML standard. Note: Only MP3, WAV, and Ogg audio are supported by the HTML standard.

can you tell about nested pages
iframe src="https://www.javatpoint.com/" height="50%" width="70%" iframe >

what is semitic element in html5
Many web sites contain HTML code like: to indicate navigation, header, and footer. In HTML there are some semantic elements that can be used to define different parts of a web page: footer, header, aside, article

what is HTML figure and figcaption Elements
The figure tag specifies self-contained content, like illustrations, diagrams, photos, code listings, etc. The figcaption tag defines a caption for a figure element. The figcaption element can be placed as the first or as the last child of a figure element.

What is Responsive Web Design?
Responsive Web Design is about using HTML and CSS to automatically resize, hide, shrink, or enlarge, a website, to make it look good on all devices (desktops, tablets, and phones):
meta name="viewport" content="width=device-width, initial-scale=1" Use a media query to add a breakpoint at 800px: media screen and (max-width: 800px) { }

What is the difference between “display: none” and “visibility: hidden”, when used as attributes to the HTML element.?
When we use the attribute “visibility: hidden” for an HTML element then that element will be hidden from the webpage but still takes up space. Whereas, if we use the “display: none” attribute for an HTML element then the element will be hidden, and also it won’t take up any space on the webpage.

What is a CSS Preprocessor? What are Sass, Less, and Stylus? Why do people use them?
A CSS Preprocessor is a tool used to extend the basic functionality of default vanilla CSS through its own scripting language. It helps us to use complex logical syntax like – variables, functions, mixins, code nesting, and inheritance to name a few, supercharging your vanilla CSS. SASS: Sass is the acronym for “Syntactically Awesome Style Sheets”. SASS can be written in two different syntaxes using SASS or SCSS SASS vs SCSS • SASS is based on indentation and SCSS(Sassy CSS) is not. • SASS uses .sass extension while SCSS uses .scss extension. • SASS doesn’t use curly brackets or semicolons. SCSS uses it, just like the CSS.

What is the Box model in CSS?
The CSS box model is essentially a box that wraps around every HTML element. It consists of: margins, borders, padding, and the actual content. width: 320px; padding: 10px; border: 5px solid gray; margin: 0;

320px (width) + 20px (left + right padding) + 10px (left + right border) + 0px (left + right margin) = 350px

Difference between CSS grid vs flexbox?
CSS Grid Layout is a two-dimensional system, meaning it can handle both columns and rows. Grid layout is intended for larger-scale layouts which aren’t linear in design. Flexbox is largely a one-dimensional system (either in a column or a row). Flexbox layout is most appropriate to the components of an application.

What is borderbox Defines how the width and height of an element are calculated: should they include padding and borders, or not There are four different combinators in CSS: • descendant selector (space) • child selector (>) : select only child selector div > p • adjacent sibling selector (+): select only div +p = div outer first p • general sibling selector (~):-select only div ~p:- div outer last p