Css Nested Classes

css nested classes – A style rule can be directly nested within another style rule if its selector is nest-prefixed. We can very easily define nested rules in LESS.

Contents

Nested classes are one of the blessings of dynamic CSS. You can use any CSS selector while nesting with spaces.You’ll write your CSS more quickly.

How to create a nested class selector?

.section4 .welcome {
  color: greem;
}

//HTML Code

  
    welcome www.pakainfo.com .....

Grouping and Nesting CSS Selectors

Grouping

h1 {
		color: green;
	}
	h2 {
		color: green;
	}
	.highlight {
		color: green;
	}

h1, h2, .highlight {
		color: green;
	}

Nesting

Descendant Selector

main p {
		font-size: 1rem;
	}
	footer p {
		font-size: 0.75rem;
	}

main p {
		font-size: 1rem;
	}
	header p, footer p {
		font-size: 0.75rem;
	}

Don’t Miss : CSS Multiple Classes

Child Selector

	main > p {
		font-size: 1rem;
	}
	header > p {
		font-size: 0.75rem;
	}

Adjacent Selector

I am a Pakainfo Master

I am www.pakainfo.com #1

I am www.infinityknow.com #2

I am www.w3diy.com #3

	h2 + p {
		font-size: 135%;
	}

I hope you get an idea about css nested classes.
I would like to have feedback on my infinityknow.com.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.

css nested classes – How to create a nested class selector?