Fundamentals of Front End Development MCQs with Answers
Practice important Fundamentals of Front End Development MCQs with answers and explanations.
Multiple Choice Questions
Q1741: What is the primary purpose of the @font-face rule?
- A: To use web-safe fonts only
- B: To embed fonts directly into the web page
- C: To specify a name for a font and link to its file
- D: To define font color
View Answer
C
Q1742: Fill in the blank: SVG Fonts allow SVG to be used as ______ when displaying text.
- A: images
- B: glyphs
- C: background
- D: colors
View Answer
B
Q1743: Which font format was developed by Microsoft specifically for use as embedded fonts on web pages?
- A: TrueType Fonts (TTF)
- B: OpenType Fonts (OTF)
- C: Web Open Font Format (WOFF)
- D: Embedded OpenType Fonts (EOT)
View Answer
D
Q1744: Fill in the blank: The font-family name defined in the @font-face rule must match the ______ used in the CSS styles.
- A: font-type
- B: font-size
- C: font-family
- D: font-style
View Answer
C
Q1745: What does the translate() method do in CSS3?
- A: Moves an element to a new position
- B: Rotates an element
- C: Scales an element
- D: Skews an element
View Answer
A
Q1746: Fill in the blank: To rotate an element clockwise by 45 degrees, use transform: ______;
- A: rotateX(45deg)
- B: rotateY(45deg)
- C: rotate(45deg)
- D: rotateZ(45deg)
View Answer
C
Q1747: Which CSS3 transform method skews an element along the X-axis?
- A: skewY()
- B: skew()
- C: skewX()
- D: scale()
View Answer
C
Q1748: Fill in the blank: To skew an element along both X and Y axes by 20 and 10 degrees, use transform: ______;
- A: skewX(20deg, 10deg)
- B: skew(20deg)
- C: skew(20deg, 10deg)
- D: matrix(1, 0, 0, 1, 20deg, 10deg)
View Answer
C
Q1749: Which method would you use to rotate an element around its Y-axis?
- A: rotateX()
- B: rotateY()
- C: rotateZ()
- D: rotate()
View Answer
B
Q1750: Fill in the blank: To move an element 50 pixels right and 100 pixels down, use transform: ______;
- A: translate(50px, 100px)
- B: translate3d(50px, 100px, 0)
- C: translateX(50px)
- D: translateY(100px)
View Answer
A