81. Which CSS methodology uses block, element, modifier syntax?
- a) BEM
- b) SMACSS
- c) OOCSS
- d) Atomic CSS
Answer: A - BEM (Block__Element--Modifier) enforces strict naming conventions like
.card__title--active.
82. Which CSS preprocessor introduces variables with $ symbol?
- a) Sass
- b) Less
- c) Stylus
- d) PostCSS
Answer: A - Sass variables are declared as
$primary-color: #333;.
83. Which Sass feature allows reusable code blocks?
- a) Mixins
- b) Extends
- c) Functions
- d) Placeholders
Answer: A - Mixins (
@mixin) bundle styles for reuse with @include.
84. Which CSS feature allows styling based on container size?
- a) Container Queries
- b) Media Queries
- c) Size Queries
- d) Element Queries
Answer: A -
@container (min-width: 300px) adapts styles to parent dimensions.
85. Which CSS feature controls rule priority layers?
- a) Cascade Layers
- b) !important
- c) Specificity Layers
- d) @priority
Answer: A -
@layer base, components; defines explicit precedence layers.
86. Which CSS property enables subgrid functionality?
- a) grid-template-columns: subgrid
- b) display: subgrid
- c) subgrid: true
- d) grid-type: subgrid
Answer: A - Subgrid inherits parent grid tracks:
grid-template-columns: subgrid.
87. Which CSS feature allows scoped styles?
- a) @scope
- b) scoped attribute
- c) :scoped
- d) style[scoped]
Answer: A -
@scope (.card) { ... } limits styles to a DOM subtree.
88. Which CSS property enables color mixing?
- a) color-mix()
- b) mix-color()
- c) blend()
- d) color-blend()
Answer: A -
color-mix(in lch, purple 50%, plum 50%) blends colors in specified color space.
89. Which CSS feature allows conditional rules based on browser support?
- a) @supports
- b) @if-support
- c) feature()
- d) @browser
Answer: A -
@supports (display: grid) { ... } checks browser capability.
90. Which CSS function creates color gradients?
- a) linear-gradient()
- b) gradient()
- c) color-gradient()
- d) blend-gradient()
Answer: A -
background: linear-gradient(red, blue) creates smooth color transitions.
91. Which CSS property controls how elements break across pages/columns?
- a) break-inside
- b) page-break
- c) column-break
- d) fragmentation
Answer: A -
break-inside: avoid prevents unwanted splits in printed/multi-column layouts.
92. Which CSS property enables smooth scrolling?
- a) scroll-behavior
- b) smooth-scroll
- c) scroll-snap
- d) scroll-transition
Answer: A -
scroll-behavior: smooth animates scroll actions.
93. Which CSS feature snaps scrolling to specific points?
- a) scroll-snap
- b) snap-points
- c) scroll-anchoring
- d) sticky-scroll
Answer: A -
scroll-snap-type: y mandatory forces alignment to scroll-snap-align points.
94. Which CSS property creates a sticky table header?
- a) position: sticky
- b) table-layout: fixed
- c) sticky-header: true
- d) thead { position: fixed }
Answer: A -
th { position: sticky; top: 0 } keeps headers visible during scroll.
95. Which CSS property controls text overflow with ellipsis?
- a) text-overflow: ellipsis
- b) ellipsis: true
- c) overflow-text: ellipsis
- d) truncate: ellipsis
Answer: A - Requires
white-space: nowrap and overflow: hidden to work.
96. Which CSS property enables GPU acceleration?
- a) transform: translateZ(0)
- b) gpu: accelerate
- c) will-change: transform
- d) Both a and c
Answer: D - Both techniques promote elements to their own compositor layer.
97. Which CSS feature allows styling based on user preferences?
- a) @media (prefers-color-scheme: dark)
- b) @media (prefers-reduced-motion)
- c) @media (prefers-contrast)
- d) All of the above
Answer: D - All are user preference media queries for accessibility.
98. Which CSS property creates a color gradient border?
- a) border-image
- b) border-gradient
- c) gradient-border
- d) border-color: linear-gradient()
Answer: A -
border-image: linear-gradient(red, blue) 1 with border-width.
99. Which CSS function calculates values dynamically?
- a) calc()
- b) var()
- c) math()
- d) compute()
Answer: A -
width: calc(100% - 20px) performs math operations.
100. Which CSS property enables aspect ratio control?
- a) aspect-ratio
- b) ratio
- c) size-ratio
- d) proportional-sizing
Answer: A -
aspect-ratio: 16/9 maintains proportional dimensions.