Front End Development Front End Development Core Technologies & Fundamentals 2 — Questions and Answers
Question 1: What does the CSS 'box-sizing: border-box' property ensure?
- Padding and border are excluded from total width
- Padding and border are included in the element's total width (Correct answer)
- The element has a visible border
- The element's margin is set to zero
Correct answer: Padding and border are included in the element's total width
With border-box, padding and border widths are included in the element's specified total width, preventing layout surprises.
Question 2: Which JavaScript keyword declares a block-scoped variable that cannot be reassigned?
- var
- let
- const (Correct answer)
- static
Correct answer: const
The const keyword declares a block-scoped variable whose binding cannot be reassigned after initialization.
Question 3: In HTML, which input type renders a date picker in modern browsers?
- type='calendar'
- type='datetime'
- type='date' (Correct answer)
- type='picker'
Correct answer: type='date'
The input type='date' attribute causes modern browsers to render a native date picker control.
Question 4: Which CSS unit is relative to the font size of the root element?
- em
- rem (Correct answer)
- vh
- px
Correct answer: rem
The rem unit (root em) is always relative to the font-size of the root <html> element, unlike em which is relative to the parent.
Question 5: What is the purpose of the JavaScript 'addEventListener' method?
- Creates a new DOM element
- Adds a CSS class to an element
- Attaches an event handler function to an element (Correct answer)
- Removes an element from the DOM
Correct answer: Attaches an event handler function to an element
addEventListener attaches a specified event handler callback to a DOM element, enabling interactive behavior.
Question 6: Which HTML5 element is used to group related form controls with a visible label?
- <group>
- <section>
- <fieldset> (Correct answer)
- <formgroup>
Correct answer: <fieldset>
The <fieldset> element groups related form controls, and <legend> provides a caption for the group, improving accessibility.
What does the CSS 'box-sizing: border-box' property ensure?