Menu
Is is possible to manipulate CSS of pseudo element :before or :after using Firebug? I know these are specific elements that are handled internally by browsers but Firebug has more low level access (I suppose) so maybe it has the ability to manipulate these as well.
473
A CSS pseudo-element is a keyword added to a selector that lets you style a specific part of the selected element(s). For example, ::first-line can be used to change the font of the first line of a paragraph.
Pseudo-classes enable you to target an element when it's in a particular state, as if you had added a class for that state to the DOM. Pseudo-elements act as if you had added a whole new element to the DOM, and enable you to style that.
In Chrome's Dev tools, the styles of a pseudo-element are visible in the panel: Otherwise, you can also input the following line in the JavaScript console, and inspect the returned CSSStyleDeclaration object: getComputedStyle(document. querySelector('html > body'), ':before');
You can't specify inline styles for pseudo-elements. This is because pseudo-elements, like pseudo-classes (see my answer to this other question), are defined in CSS using selectors as abstractions of the document tree that can't be expressed in HTML.
You can edit a stylesheet in the CSS tab and
However, I can't find any pseudo-element styles in the computed styles panel. Probably because the styles don't apply to the elements but rather their contained pseudo-elements. Neither can I find a way to inspect pseudo-elements using Firebug.
118
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
