1. Which CSS property is used to create rounded corners on elements?
(A) radius
(B) corner-radius
(C) border-round
(D) border-radius
2. Which value rounds all four corners of an element equally?
(A) border-radius: 10px 20px 30px 40px;
(B) border-radius: 10px 20px;
(C) border-radius: 10px;
(D) border-radius: 50% 50%;
3. Which CSS property allows using an image as the border of an element?
(A) border-picture
(B) border-image
(C) border-src
(D) border-style-image
4. Which three sub-properties are commonly used with border-image?
(A) border-image-source, border-image-slice, border-image-repeat
(B) border-image-url, border-image-size, border-image-style
(C) border-source, image-slice, image-repeat
(D) border-img, img-slice, img-repeat
5. Which CSS property sets the background color of an element?
(A) background-color
(B) bg-color
(C) color
(D) background
6. Which property sets an image as the background of an element?
(A) background-pic
(B) background-src
(C) background-image
(D) image-background
7. Which CSS property controls whether a background image repeats?
(A) repeat-image
(B) background-tiling
(C) background-repeat
(D) image-repeat
8. Which CSS property sets the position of a background image?
(A) image-position
(B) background-align
(C) background-orientation
(D) background-position
9. Which CSS property defines the overall color of text?
(A) color
(B) text-color
(C) font-color
(D) foreground-color
10. Which of these is a valid CSS color keyword?
(A) cyanblue
(B) ultraviolet
(C) brightred
(D) rebeccapurple
11. Which of the following is NOT a valid CSS color keyword?
(A) blurple
(B) gold
(C) lime
(D) teal
12. Which CSS function creates a linear gradient?
(A) radial-gradient()
(B) linear-gradient()
(C) gradient-linear()
(D) color-gradient()
13. Which CSS function creates a gradient radiating from the center outward?
(A) conic-gradient()
(B) linear-gradient()
(C) radial-gradient()
(D) circular-gradient()
14. Which CSS property applies a shadow to text?
(A) font-shadow
(B) shadow
(C) box-shadow
(D) text-shadow
15. Which CSS property applies a shadow to a box element?
(A) box-shadow
(B) shadow-box
(C) text-shadow
(D) element-shadow
16. Which of the following values is required to define a basic box shadow?
(A) Width, height, blur, spread
(B) Horizontal offset, vertical offset, blur radius, color
(C) Offset-x, offset-y, rotation, color
(D) Left, top, right, bottom
17. How do you make a circular element using border-radius?
(A) border-radius: circle;
(B) border-radius: 100%;
(C) border-radius: 50%;
(D) border-radius: round;
18. Which CSS property sets multiple background images on the same element?
(A) images-background
(B) background-images
(C) multi-background
(D) background-image with comma-separated values
19. Which CSS gradient can be used to create repeating stripes?
(A) linear-gradient()
(B) repeating-linear-gradient()
(C) radial-gradient()
(D) gradient-repeat()
20. Which of the following is a correct syntax for a text shadow?
(A) text-shadow: 2px 2px gray 5px;
(B) text-shadow: gray 2px 2px 5px;
(C) text-shadow: 2px 2px 5px gray;
(D) text-shadow: 5px 2px 2px gray;
21. Which CSS property adds a shadow effect to text?
(A) font-shadow
(B) box-shadow
(C) text-shadow
(D) shadow-text
22. Which CSS property is used to transform text into uppercase?
(A) text-case
(B) text-transform
(C) font-transform
(D) text-style
23. Which property is used to control letter spacing in text?
(A) letter-spacing
(B) word-spacing
(C) text-spacing
(D) spacing
24. Which CSS property allows importing and using custom fonts?
(A) font-import
(B) @font-face
(C) custom-font
(D) font-family
25. Which property defines the name of the custom font inside @font-face?
(A) font-family
(B) font-name
(C) font-src
(D) font-style
26. Which property specifies the URL of a custom font in @font-face?
(A) url
(B) src
(C) font-url
(D) font-src
27. Which CSS property rotates an element in 2D space?
(A) transform: translate(45px);
(B) transform: skew(45deg);
(C) transform: rotate(45deg);
(D) transform: scale(1.5);
28. Which CSS function moves an element along the X and Y axes?
(A) skew(x, y)
(B) rotate(x, y)
(C) translate(x, y)
(D) scale(x, y)
29. Which property can skew an element along the X or Y axis in 2D?
(A) skew(x-angle, y-angle)
(B) translate(x-angle, y-angle)
(C) rotate(x-angle, y-angle)
(D) scale(x-angle, y-angle)
30. Which property resizes an element in 2D space?
(A) stretch(x, y)
(B) resize(x, y)
(C) transform-size(x, y)
(D) scale(x, y)
31. Which CSS property applies a perspective to 3D transformed elements?
(A) perspective
(B) transform-perspective
(C) perspective-origin
(D) perspective-depth
32. Which property sets the origin point for 3D transformations?
(A) perspective-origin
(B) origin-3d
(C) transform-origin
(D) transform-center
33. Which CSS function rotates an element around the X-axis in 3D?
(A) rotate3D(angle)
(B) rotateY(angle)
(C) rotateZ(angle)
(D) rotateX(angle)
34. Which function rotates an element around the Y-axis?
(A) rotateZ(angle)
(B) rotateX(angle)
(C) rotateY(angle)
(D) rotate3D(angle)
35. Which CSS function rotates an element around the Z-axis?
(A) rotateX(angle)
(B) rotateZ(angle)
(C) rotateY(angle)
(D) rotate3D(x, y, z, angle)
36. Which CSS function allows rotating an element in an arbitrary 3D axis?
(A) rotate3D(x, y, z, angle)
(B) rotateX(angle)
(C) rotateY(angle)
(D) rotateZ(angle)
37. Which CSS function moves an element in 3D space along X, Y, and Z axes?
(A) transform3D(x, y, z)
(B) translate(x, y, z)
(C) move3D(x, y, z)
(D) translate3d(x, y, z)
38. Which CSS function scales an element in 3D space?
(A) scale3d(x, y, z)
(B) scale(x, y, z)
(C) transform-scale(x, y, z)
(D) resize3d(x, y, z)
39. Which property combines multiple 2D and 3D transformations in one declaration?
(A) multi-transform
(B) transform-combine
(C) transform
(D) transform-all
40. Which property allows smooth transitions for 2D and 3D transforms?
(A) transition
(B) transform-duration
(C) animation
(D) transform-delay
41. #41: Which CSS property defines how long a transition should take to complete?
(A) transition-timing
(B) transition-delay
(C) transition-duration
(D) animation-duration
42. Which property sets the timing function for a CSS transition?
(A) transition-timing-function
(B) transition-function
(C) animation-timing
(D) transition-style
43. Which property specifies which CSS properties should transition?
(A) transition-target
(B) transition-style
(C) transition-property
(D) transition-apply
44. Which at-rule defines keyframes for CSS animations?
(A) @frames
(B) @animation
(C) @transition
(D) @keyframes
45. Which property sets the name of the animation to use?
(A) animation-name
(B) animation-key
(C) animation-frame
(D) animation-id
46. Which property controls how many times an animation should play?
(A) animation-repeat
(B) animation-iteration-count
(C) animation-duration
(D) animation-cycle
47. Which CSS property displays additional information when hovering over an element?
(A) tooltip
(B) title
(C) data-tooltip
(D) hover-text
48. Which CSS pseudo-class is commonly used to show a tooltip on hover?
(A) active
(B) hover
(C) focus
(D) tooltip
49. Which CSS property adds a border radius to an image?
(A) border-radius
(B) image-radius
(C) img-border
(D) radius
50. Which CSS property applies a shadow to an image?
(A) shadow-img
(B) image-shadow
(C) box-shadow
(D) img-shadow
51. Which CSS property controls the opacity of an image?
(A) opacity
(B) filter-opacity
(C) image-opacity
(D) alpha
52. Which CSS property can make an image grayscale?
(A) opacity: 100%
(B) filter: grayscale(100%)
(C) image-filter: gray
(D) filter-gray
53. Which CSS property is used to display an image in a modal popup?
(A) image-popup
(B) modal-image
(C) display: block with JavaScript for modal
(D) display: modal
54. Which property centers an image inside a modal container?
(A) align-items: center;
(B) text-align: center;
(C) margin: auto;
(D) justify-content: center;
55. Which property adds a transition effect to an image hover state?
(A) transition
(B) animation
(C) transform
(D) filter
56. Which CSS function can scale an image on hover?
(A) image-scale(1.1)
(B) scale-image(1.1)
(C) zoom(1.1)
(D) transform: scale(1.1);
57. Which pseudo-class is used to change an image style when hovered?
(A) active
(B) focus
(C) hover
(D) image
58. Which CSS property can make an image appear circular?
(A) border-radius: 50%;
(B) circle-shape: true;
(C) shape: circle;
(D) border-radius: 100%;
59. Which CSS property adds a smooth transition effect when hovering over an image?
(A) animation: hover 0.3s;
(B) transition-hover: all 0.3s;
(C) hover-effect: smooth;
(D) transition: all 0.3s ease;
60. Which property is commonly used with image modals to darken the background?
(A) background-opacity: 0.7;
(B) background-color: rgba(0, 0, 0, 0.7);
(C) overlay-color: black;
(D) filter: darken(70%);
61. Which CSS property centers an image horizontally inside a block element?
(A) text-align: center;
(B) margin: 0 auto;
(C) align-items: center;
(D) justify-content: center;
62. Which property centers an image inside a parent using flexbox?
(A) display: flex; justify-content: center; align-items: center;
(B) display: flex; text-align: center;
(C) display: block; margin: auto;
(D) align: center;
63. Which CSS filter makes an image appear brighter?
(A) filter: opacity(150%);
(B) filter: contrast(150%);
(C) filter: grayscale(150%);
(D) filter: brightness(150%);
64. Which filter converts an image to grayscale?
(A) filter: contrast(100%);
(B) filter: blackwhite(100%);
(C) filter: grayscale(100%);
(D) filter: opacity(100%);
65. Which CSS property creates circular or elliptical image shapes?
(A) object-fit
(B) clip
(C) shape-outside
(D) border-radius
66. Which CSS property can clip an image into a custom shape?
(A) clip-path
(B) clip-image
(C) mask-shape
(D) shape-clip
67. Which property determines how an image fits into its container?
(A) image-fit
(B) object-position
(C) object-fit
(D) fit-image
68. Which object-fit value scales the image to cover the entire container, possibly cropping?
(A) cover
(B) contain
(C) fill
(D) none
69. Which object-fit value scales the image to fit inside the container without cropping?
(A) cover
(B) contain
(C) fill
(D) none
70. Which object-fit value stretches the image to fill the container, ignoring aspect ratio?
(A) fill
(B) cover
(C) contain
(D) scale
71. Which CSS property sets the alignment of an image inside its container?
(A) align-image
(B) image-position
(C) object-position
(D) position
72. Which is the correct syntax to position an image at the top right of its container using object-position?
(A) position: top right;
(B) object-position: right top;
(C) object-align: top right;
(D) object-position: top right;
73. Which filter blurs an image?
(A) filter: soften(5px);
(B) filter: smooth(5px);
(C) filter: blur(5px);
(D) filter: fade(5px);
74. Which filter adjusts image contrast?
(A) filter: brightness(120%);
(B) filter: contrast(120%);
(C) filter: saturation(120%);
(D) filter: hue-rotate(120deg);
75. Which CSS property is used to create rounded corners for circular or oval images?
(A) border-radius: 50%;
(B) border-radius: 100%;
(C) clip-path: circle();
(D) shape: circle;
76. Which filter rotates the hue of an image?
(A) filter: color-rotate(90deg);
(B) filter: rotate-hue(90deg);
(C) filter: hue-rotate(90deg);
(D) filter: color-shift(90deg);
77. Which object-position value centers an image inside its container?
(A) object-position: center;
(B) object-position: middle;
(C) object-align: center;
(D) position: center;
78. Which object-fit value leaves the image at its original size?
(A) none
(B) fill
(C) cover
(D) contain
79. Which filter inverts the colors of an image?
(A) filter: reverse(100%);
(B) filter: negative(100%);
(C) filter: invert(100%);
(D) filter: flip(100%);
80. Which filter increases the saturation of an image?
(A) filter: hue-rotate(150deg);
(B) filter: contrast(150%);
(C) filter: brightness(150%);
(D) filter: saturate(150%);
81. Which CSS property is used to hide parts of an image or element?
(A) filter
(B) clip
(C) mask
(D) overflow
82. Which property sets the image to use as a mask?
(A) mask-image
(B) mask-src
(C) clip-image
(D) image-mask
83. Which property sets the size of a mask image?
(A) clip-size
(B) mask-scale
(C) mask-dimensions
(D) mask-size
84. Which CSS property creates clickable buttons with custom styles?
(A) button-style
(B) input-type="button"
(C) button
(D) cursor: pointer;
85. Which property changes the background color of a button on hover?
(A) button-hover { color: #f00; }
(B) button:hover { background-color: #f00; }
(C) hover-button { background: #f00; }
(D) button:active { background-color: #f00; }
86. Which property adds a shadow effect to a button?
(A) shadow-button
(B) text-shadow
(C) box-shadow
(D) button-shadow
87. Which property creates pagination links for a website?
(A) ul li { display: inline-block; }
(B) pagination { list-style: none; }
(C) nav { display: pagination; }
(D) page-links { display: block; }
88. Which property styles active pagination links?
(A) pagination:active { color: #fff; }
(B) a.current { background-color: #333; color: #fff; }
(C) li.active { color: #333; }
(D) a.active { background-color: #333; color: #fff; }
89. Which property sets the number of columns for multi-column layout?
(A) column-count
(B) columns
(C) column-width
(D) multi-columns
90. Which property sets the width of each column in a multi-column layout?
(A) column-width
(B) column-size
(C) columns
(D) column-span
91. Which property sets the gap between columns?
(A) columns-gap
(B) column-spacing
(C) column-gap
(D) gap-columns
92. Which property allows an element to span multiple columns?
(A) span-columns
(B) column-span
(C) multi-span
(D) columns-merge
93. Which CSS property controls the appearance of a scrollbar?
(A) scrollbar-color
(B) overflow-style
(C) scroll-color
(D) scroll-style
94. Which pseudo-element styles the scrollbar thumb?
(A) -scroll-thumb
(B) scroll-thumb
(C) -webkit-scrollbar-thumb
(D) thumb-scroll
95. Which property changes the cursor when hovering over a UI element?
(A) mouse: pointer;
(B) cursor-style: hand;
(C) cursor: pointer;
(D) hover-cursor: pointer;
96. Which property sets the visual focus style of an input element?
(A) input-focus
(B) border-focus
(C) focus-style
(D) outline
97. Which property disables text selection for UI elements?
(A) text-select: off;
(B) disable-select: true;
(C) user-select: none;
(D) selectable: false;
98. Which property makes a UI element unclickable while still visible?
(A) disabled: true;
(B) pointer-events: none;
(C) clickable: false;
(D) opacity: 0.5;
99. Which property adds smooth transitions to UI element changes?
(A) effect
(B) animation
(C) transition
(D) ui-transition
100. Which property controls the stacking order of UI elements?
(A) order
(B) stack-order
(C) layer
(D) z-index