Why prefer use of CSS pseudo class to apply background image instead of directly applying to the element?

Question

I was going through different video tutorials and a few suggested to use ::before pseudo selector to apply background image.

Is there any specific reason to follow this trend?

@SawanPatodia, Please find the link : https://www.youtube.com/watch?v=8KVrdL0VcAk&list=PLu0W_9lII9agiCUZYRsvtGTXdxkzPyItg&index=39 — Anand, Jul 19 '20 at 06:36
This is in Hindi and the person is talking about pseudo selector at 24:00. — Anand, Jul 19 '20 at 06:36

saraserin · Answer 1 · 2020-07-19T12:42:06.710

1

It is really a personal preference. Using ::before and ::after pseudo elements in this case allows you to insert images without the need for adding extra html elements.

Here is an example by Bryan Robinson of its clever usage

You can see how it can be used to create a three layered image background with just a single html element.

edited Jul 19 '20 at 12:42

answered Jul 19 '20 at 12:22

saraserin

170
1
6

Thank you so much. I understand now it's usage quite a bit. – Anand Jul 19 '20 at 13:20

Why prefer use of CSS pseudo class to apply background image instead of directly applying to the element?

1 Answers1