TIL, CSS Pseudo Classes and Elements

#css #html #javascript #learning

Hey guy,
I'm Esraa a front-end developer, wife, and mom.
It’s been a long time since I wrote an article so excuse me for any mistakes.

Here’s what the difference between CSS pseudo-classes VS pseudo-elements

First of all I need to know What is a pseudo prefix reference for? a class or an element that is not real.
and How?
It's mean not in your HTML or part of your DOM.

There's examples for pseudo-classes helps to understand the difference

Pseudo-classes: used to target state
:hover
:active
:link
:target
:invalid
:valid

Example for :focus, and :focus-within

For more example Click here

Pseudo-elements: used to target specific part of element

::before
::after
::first-letter
:first-line
::selection

::first-letter

For more example Click here

and I read a useful JavaScript article about operators you can check it out here.

So let's share our knowledge and tell me what you learned today.

Here are my social links if you would like to follow.

Github: https://github.com/EsraaNasr92/
Twitter / X: https://twitter.com/Esraa_nasr92
Instgram: https://www.instagram.com/_esraaanasr/

I hope to publish my portfolio this week. Wish me luck

JavaScript UI Libraries for Surveys and Forms

SurveyJS lets you build a JSON-based form management system that integrates with any backend, giving you full control over your data and no user limits. Includes support for custom question types, skip logic, integrated CCS editor, PDF export, real-time analytics & more.

Learn more