Let’s Get Deep In CSS Selector part 1

Photo by Silvan Arnet on Unsplash

CSS Selectors used to identify specific HTML elements as target for CSS style. This topic talks how CSS Selector pick HTML documents. There were many methods of CSS Selector, that we could use. In my articles, I would just explain that we’ll use it often. Let’s get started.

#1 Universal Selector

This method used to target all of HTML elements. Usually, it was used to reset margin and padding all of elements (but someone said, it was not worth it to do this). We use this method by using symbol *.

#2 Element selector or Tag selector

An element selector used to target an element of HTML document that we picked it to style. If we would style h1 element, we just write h1 then we give the property that we want to use it.

#3 class selector

a class selector used to target all element with the class that we wanted it. A class selector used by point and then the class name (.class-name).

#4 ID selector

An ID selector was used to target an element with id attribute, this selector used by using tag, and then id’s name (#id-name).

#5 Descendant selector

A descendant combinator, used by at least on a space character, selects elements that are a descendant of the defined element. This combinator select all descendant of the elements (from child elements on down).

#6 Child selector

The child selector (>) combinator is used to target elements that are children or direct descendant of the specified element.

to be continued

connect with me on my social media

pinterest

instagram

Support me by buying the product from affiliate’s link below:

affiliate

--

--

--

Blogger and Content Creator. #buildnewkills #getnewfriends #trynewexperiences

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

Today We Built A Thing

3 Insanely Simple Steps To DIY Tooltips

Manage Database Releases With Pre- and Post-Deployment Scripts

Developing Android Studio plugins with Gradle

C++ VS JAVA-AN ANALOGY

Docker Testing in Distributed Systems

BCA Network partners with Meson Network on Web3.0 decentralized bandwidth solution

Streamline development process with CI and AutoDeploy with Docker Cloud.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Aria Nur Jamal

Aria Nur Jamal

Blogger and Content Creator. #buildnewkills #getnewfriends #trynewexperiences

More from Medium

@import in CSS, SCSS, and LESS

Let’s Get started with CSS

CSS Concept !!!

How to style dl, dt, and dd HTML tags