+ 3

Let's say I have a image and I want a text to appear when I hover the image.

When I hover the image there will appear a text in the middle of it. I guess I should use somehow :hover and ::after or ::before with content:"text"; but ...I am not sure how to do that. An example or a link to more informations about that would be useful. 😀

27th Oct 2019, 10:45 AM
🍇 Alex Tușinean 💜
🍇 Alex Tușinean 💜 - avatar
2 Answers
+ 2
.container { width: 150px; height: 150px; background-image: url("youimage"); } .container::before { content: "Hello"; position: absolute; top: 75px; left: 75px; } .container:hover::before { content: ""; }
27th Oct 2019, 12:12 PM
Anna/Аня - avatar
+ 1
Pseodo element cannot work with img tag, use div with background instead https://code.sololearn.com/Wm0K55tIJ57v/?ref=app
27th Oct 2019, 12:01 PM
Calviղ - avatar