Placement Assistance Program Interview based Assignment
T.Prabin Patra
HTML Questions :
1) <!DOCTYPE html> is it a tag of html? If not, what is it and why do we use it?
Answer :
In an HTML Document, DOCTYPE is used to declare the web browser about what version of HTML the page or file is written. and it is the first line of code required in every HTML File.
2) Explain Semantic tags in html? And why do we need it?
Answer :
Semantic Tags are easy to describe their meaning to both the developer and the browser. Semantic tags are <header>, <footer>, <nav>, <article>, <figure> etc.
Many developers write <div id="header"></div> for Header Section but we use the semantic tag and we write the code like this <header></header> .
3) Differentiate between HTML Tags and Elements?
Answer :
Html tags are used to define the structure and also we called they are html building blocks example <p></p>.
HTML Elements are components that are used in HTML Pageand it consists of an opening tag, the content, and a closing tag . example <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Aperiam minima quis itaque?</p>.
5) Write Html code so that it looks like the given image
6) What are some of the advantages of HsTML5 over its previous versions?
Answer :
HTML5 introduced new semantic elements such as <header>, <nav> and <footer> etc. and also html5 give multi media functionalities and give <audio> and <video> tags.
add new element <canvas> for enables dynamic rendering and manipulation of graphics, animations, and visualizations using JavaScript
8) What is the difference between <figure> tag and <img> tag?
Answer :
<img> tag is used to embed the image file in html deocument and it is self closing tag.
<figure> tag is used to group and provide a caption for a self-contained content, such as an image, illustration, diagram, or video.
9) What’s the difference between html tag and attribute and give example of some global attributes?
Answer :
HTML tags are used to define the structure and presentation of content within an HTML document.
HTML attributes provide additional information or properties to HTML elements.
html tags example :
<h1>Look</h1>
html attributes example :
<a href="#">Look</a>
1) Whats Box Model in CSS & Which CSS Properties are part of it ?
Answer :
box model in CSS is a fundamental concept that defines the layout and sizing of elements on a web page. It describes how an element is rendered within a rectangular box, consisting of content, padding, border, and margin.
2) What are the Different Types of Selectors in CSS & what are the advantages of them?
Answer :
There are many selectors are present in css. first one is Element Selectors, it's Select elements based on their HTML tag name. Class Selectors, it's Select elements based on their assigned class attribute. ID Selectors, it's Select a specific element based on its assigned ID attribute. Attribute Selectors, it's Select elements based on their attribute values. Pseudo-classes and Pseudo-elements: Select elements based on specific states or conditions or target specific parts of an element.
3) What is VW/VH & How its different from PX?
Answer :
VW (Viewport Width) and VH (Viewport Height) are CSS units of measurement that are relative to the size of the viewport, difference is that VW and VH units are relative to the viewport size, while PX is an absolute unit.
VW and VH allow for responsive designs
4) Whats difference between Inline, Inline Block and block ?
Answer :
Line breaks aren't created by inline elements, which merely occupy the necessary space. Elements within inline blocks flow inline but they might additionally have width and height. Line breaks are made using block elements, which take up the entire width.
5) Whats difference between Inline, Inline Block and block ?
Answer :
Border-box includes padding and border within the specified width and height of an element. Content-box only considers the content and adds padding and border on top of the specified width and height.
6) What’s z-index and How does it Function ?
Answer :
z-index property determines the stacking order of elements on a web page along the z-axis, which is perpendicular to the screen. It is used to control the visibility and overlapping of elements, allowing you to specify which elements should appear in front of or behind others.
z-index property accepts integer values
9) Build given layout using grid or flex see below image for reference
12) What are Pseudo class in CSS & How its different From Pseudo Elements?
Answer :
Pseudo-classes in CSS select elements based on state or relation to the document tree (e.g., :hover, :active), while pseudo-elements create virtual elements for styling specific parts of an element (e.g., ::before, ::after)
Javascript Questions :
1) What is Hoisting in Javascript ?
Answer :
Hoisting is a JavaScript behavior where variable and function declarations are moved to the top of their containing scope during the compilation phase before the code is executed.
Hoisting applies to both variable declarations and function declarations, allowing you to use them before they are actually declared in the code.
Hoisting only lifts the declarations, not the initializations or assignments, so it's important to be aware of the order of assignments to avoid unexpected results. It's considered best practice to declare variables and functions at the beginning of their respective scopes.
2) What are different higher order functions in JS? What is the difference between .map() and .forEach() ? (2
Answer :
The map() method is used to transform the elements of an array, whereas the forEach() method is used to loop through the elements of an array.
The forEach() method returns “undefined“. The map() method returns the newly created array according to the provided callback function.
foreach() is not executed for empty elements. map() does not change the original array.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent