PHPnews.io

Style Pseudo-elements with Javascript Using Custom Properties

Written by Bram.us / Original link on Apr. 1, 2021

css-irl.png

Over at CSS { In Real Life }, author Michelle Barker has detailed a clever way to style pseudo-elements (such as ::before and ::after) through JavaScript.

In Javascript we have a few ways of selecting elements, but we can’t directly target pseudo-elements. […] Luckily, CSS custom properties can help.

👉 If you set a custom property on the element that “owns” the pseudo-element the pseudo-element itself can pick it up, thus enabling a way to style it.

Quick Tip: Style Pseudo-elements with Javascript Using Custom Properties →

bram bram tutorialzine tutorialzine link bram bram

« Good Programmers - Debug/Inspect z-index stacking with the “CSS Stacking Context Inspector” DevTools extension »