CSS stands for Cascading Style Sheet and is used to style a webpage. It defines how the HTML elements are to be displayed on the webpage. It helps you apply the style to HTML elements like font, colours, spacing, positioning, etc.
CSS is one of the most basic skills that a front-end web developer needs. Master the most commonly asked questions in CSS for your next interview with the help of CSS interview questions and answers curated by expert developers.
1. What are the benefits of Using CSS Variables?
- -Responsive Design: Easily adapt styles with media queries
- -Reusability: Define fonts, colours, spacing, and more once, then reuse them throughout your stylesheets.
- -Easy and Dynamic Updates: Modify variables using JavaScript for eazy and dynamic styling updates.
- -Global Scope: Variables can be restricted to specific components or applied across your entire website.
2. Name some CSS Frameworks
Some of the css frameworks are Bootstrap, Gumby, Foundation, Semantic UI, Ukit etc.
3. Name some media types allowed by CSS
The different media types allowed by CSS are:
- speech
- tactile media
- grip media or bitmap
- audio
- visual
- interactive media
- continuous or paged media
4. How can you use CSS to control image repetition using the background-repeat property?
h3 {
background-repeat: none;
}
5. Explain different types of CSS Selectors
CSS categories can be divided into five:
- Simple selectors
- Combinator selectors
- Pseudo-class selectors
- Pseudo-elements selectors
- Attribute selectors
6. What is the difference between Pseudo-class selectors and Pseudo-elements selectors in CSS?
Pseudo-class selectors and Pseudo-elements selectors are the two selectors in CSS. where Pseudo-class selectors, select elements based on a certain state. Whereas Pseudo-elements selectors select and style a part of an element.
7. What are the different ways to Inserting a style sheet?
There are 3 ways of inserting a style sheet:
- External CSS
- Internal CSS
- Inline CSS
8. List Some CSS Background Properties
- background-image
- background-attachment
- background-color
- background-position
- background-repeat
- background (shorthand property)
9. What is the difference between CSS Margin and Padding?
-CSS Margin property is used to create space around elements. CSS padding is used to generate space inside of any defined borders, which means generating space around the content of an element.
10. List CSS Margin Properties
- margin-top
- margin-right
- margin-bottom
- margin-left
11. List CSS Padding Properties
- padding-top
- padding-right
- padding-bottom
- padding-left
12. What is the difference between class and ID?
ID is unique in HTML Page (A separate style for a particular element). Whereas, Class can be a part of multiple elements. This means a single style can be used for many elements. In the case priority, ID has more priority than class.