CSS Tutorial For Beginners 20 - Hover, Active & Visited Effects

Yo ninjas, in this CSS tutorial for beginners we'll dive into a few examples of dynamic pseudo classes. Namely, we'll look at 3 of the most commonly used ones - hover, active and visited states of elements (mainly links). Have fun and keep coding :).

========== CSS for Beginners Playlist ==========

========== HTML Basics Course ==========

========== The Net Ninja ============

========== Social Links ==========

[sandeepponnusamy]

Tutorials back 6 years
& My friend suggested & I will never regret, it as it's worth much till date🙏

[briantoon]

I noticed that once you have visited the link, you no longer get the red hover effect unless you reorder the CSS file putting a:hover{ color: red } at the end

[ivanyosifov]

Remember *LOVE HATE* (LVHA) - the correct order for link pseudoclasses
a:link
a:visited
a:hover
a:active

[youarewelcome]

There is actually some important rules:
a:hover MUST come after a:link and a:visited
a:active MUST come after a:hover
In my browser, it did not work otherwise.

[Marsell]

Hi,
is there a way you can set all attributes (link, visited, hover, active) for a single link element without making 4 different syntax blocks?

[intigonzalez]

Why is it that sometimes things are in front of the hover like: ul li a:hover img {...} instead of behind the hover - ul li a img:hover {...}
???

[weswes]

how can I make font size increase hover effect without affecting other inline text?

[amritaacharjee]

Sir, why my css link is not connecting in html file? Kindly help me.

[ismahenelarbi]

Hi,
What if I wanted to change on image on hover ?
thanks for the tuts :)

[Yeet-vvqj]

If i click on a link once (so it is visited and changes color) and then refresh the page, the link's color doesn't return to it's "a:link" state (unvisited). How can I avoid that?

Minute: 40:20)

[joannehughes]

L,
V,
H,
A
(love and hate): link, visited, hover and active - else you'll override yourself