CSS Interview Questions
CSS Interview Questions
1. What is CSS?
Answer:
CSS (Cascading Style Sheets) is a stylesheet language used to control the presentation of HTML elements. It allows
developers to style web pages using colors, fonts, layouts, and animations.
Answer:
html
CopyEdit
html
CopyEdit
<style>
p { color: red; }
</style>
3. External CSS – Stored in a separate .css file and linked using <link>.
html
CopyEdit
3. What is the difference between relative, absolute, fixed, and sticky positioning?
Answer:
Position Behavior
absolute Positioned relative to the nearest positioned ancestor (or <html> if none).
sticky Switches between relative and fixed based on the scroll position.
Example:
css
CopyEdit
.position-relative { position: relative; top: 10px; left: 20px; }
Answer:
Example:
css
CopyEdit
Answer:
Example:
css
CopyEdit
html
CopyEdit
Answer:
Examples:
css
CopyEdit
/* Pseudo-class */
/* Pseudo-element */
Answer:
Flexbox is a layout model for arranging elements efficiently.
Example:
css
CopyEdit
.container {
display: flex;
Answer:
Example:
css
CopyEdit
Answer:
Example:
css
CopyEdit
.container {
max-width: 800px;
min-width: 400px;
width: 100%;
Answer:
Media queries allow CSS to adapt based on screen size.
Example:
css
CopyEdit
Example:
css
CopyEdit
.container {
display: grid;
gap: 10px;
12. What is the difference between visibility: hidden; and display: none;?
Answer:
Example:
css
CopyEdit
Answer:
opacity: 0; – The element is invisible but still takes up space and is clickable.
Example:
css
CopyEdit
.hidden-opacity { opacity: 0; }
Example:
css
CopyEdit
Answer:
Use Flexbox for aligning elements, and Grid for overall page layout.