Web Design Interview Questions and Answers
Question - 81 : - What is z-index in CSS?
Answer - 81 : -
Z-index is a property in CSS that is used to define the order of elements on a web page. It works on the basis of order indices, where a higher-order element will appear before a lower-order element.
It only applies to elements that are positioned, i.e., those elements having the position attribute compulsorily.
Consider the following example:
div {
position: fixed;
left: 15px;
top: 20px;
z-index: -1;
}
Question - 82 : - Why is float used in CSS?
Answer - 82 : -
Float is a popular property in CSS to control the layout and position of an element on a web page.
Any element can be placed on the web page as per requirement. Consider the following example:
div { float: right; }
Question - 83 : - What is the use of media queries in CSS3?
Answer - 83 : -
Media queries are used to define styles in CSS, which are responsive based on a variety of shapes and sizes of the viewing window.
They are used to adjust the following entities:
- Height
- Width
- Viewport
- Resolution
- Orientation
Question - 84 : - What is the use of pseudo-classes in CSS?
Answer - 84 : -
Pseudo-classes are used as a popular technique in CSS to change the style of an element when this element changes its state.
There are numerous examples of when you use a pseudo-class:
- For the style change when the mouse moves over the element
- For out-of-focus animations
- For providing styles for external links
Question - 85 : - What are some of the properties of transitions in CSS3?
Answer - 85 : -
Transitions in CSS3 are easy to use, and they provide users with rapid and efficient animation effects.
The four main properties present in the transitions are:
- transition-delay
- transition-duration
- transition-property
- transition-timing-function
Question - 86 : - What are the components of the CSS box model?
Answer - 86 : -
The CSS box model is used to represent an entity that encloses all of the HTML content into a box or a button element.
There are four components:
- Border: Denotes the padding and content around the border
- Content: Refers to the actual content to be displayed
- Margin: Refers to the top layer of the box element
- Padding: Defines the empty space around the element
Question - 87 : - What is pagination? How can pagination be implemented?
Answer - 87 : -
Pagination is a simple sequence of pages on a website. These pages are interconnected and have similar content to display to the users.
A simple example is the page selector on an e-commerce site that allows the users to browse through the products present on multiple pages rather than scrolling up and down on one single page.
It can easily be implemented in CSS3 using the following code:
Question - 88 : - What are the various data types present in JavaScript?
Answer - 88 : -
JavaScript supports the following data types:
- Boolean
- Number
- Object
- Undefined
- Null
- String
- Function
Question - 89 : - How can styles or classes be changed in elements using JavaScript?
Answer - 89 : -
JavaScript can be used to easily modify classes and styles in an element by making use of the following syntax:
Modify styles: document.getElementById(“input”).style.fontSize = “10”;
Modify class: document.getElementById(“button”).className = “classname”;
Question - 90 : - What is the difference between and ?
Answer - 90 : -
The event is not called until a page is completely loaded with the entire styling from CSS and images. The event does add a bit of delay when rendering a web page. With the event, it will wait only till the DOM is initialized and will begin the event action. This ensures to reduce any delays in actions.