EEMI

Guided Notes

Links, Lists, Tables & Forms

Styling link states, lists, navigation bars, tables, form controls, and buttons.

Link states

Slide 1 / 5

Links have four states, styled in this order (remember LoVe HAte):

a:link — not visited yet. a:visited — already visited. a:hover — the pointer is over it. a:active — being clicked.

Add :focus-visible for keyboard users: a:focus-visible { outline: 3px solid orange; outline-offset: 2px; }

Keep links recognisable — if you remove the underline, make them clearly different in color and weight.

← Responsive Design