Which CSS3 property is most effective for creating a hover effect on a menu item?

Question

Options

• Acolor
• Bbackground-color
• Ctext-decoration
• Dborder-radius

• A
  6% (3)
• B
  90% (44)
• C
  2% (1)
• D
  2% (1)

Explanation

background-color is the most effective CSS3 property for creating a hover effect on a menu item because it visually highlights the entire clickable area, giving users clear feedback that they're hovering over a selection - this is standard UI/UX practice for navigation menus.

Why the distractors are wrong:

• A. color - changes only the text color, which is too subtle and doesn't highlight the full menu item area
• C. text-decoration - adds underlines or strikethroughs, which is better suited for links than menu hover states
• D. border-radius - rounds corners but doesn't provide any visual color feedback on hover; shape alone isn't a hover effect

Memory tip: Think of a menu item as a "button" - when you hover a button, the whole background changes. background-color = background area highlight = the go-to hover property. If you remember :hover { background-color: ... } as the classic CSS snippet, you'll never second-guess this.

No community discussion yet for this question.