First, I was wondering why I need to add cursor:pointer;
for a hover effect on elements like <button>
, <label>
, checkbox, and radio?
Second, why do <a>
tags have this by default?
Please take a look at these answered similar questions
This comes from historical perspective of web page usage. Labels are meant to be read-only. buttons, checkboxes and radios are visibly clickable by default. So, where-ever any one sees them on page, they know it can be clicked or checked. An anchor tag may hide between other text on the page, and may get hidden from view by styling, so a hover pointer over that (if they have a url to point to) will signify that this is click-able part of text, and will help in page navigation.
You can check these details in many more answers here. https://ux.stackexchange.com/questions/105024/why-dont-button-html-elements-have-a-css-cursor-pointer-by-default
<a>
tags don't have it by default unless there is an href property.