How to add parent class to css file?

Question

how to add parent class to css file

sourcse css

.pagination {
   font-size: 10px
}
a {
   font-size: 30px
}
...............

To get something like this

.parent-class {
   .pagination {
        font-size: 10px
   }
   a {
     font-size: 30px
   }
   ...............
}

It should be a lot, it will be automatically completed

Answer 1

you have a structure sass/ scss/ less.

In cssyou do it like this: -

.parent-class .pagination {
        font-size: 10px
}
.parent-class a {
     font-size: 30px
}
...............

Once sass/ scss/ lesscompiled, it generates the structure cssabove.

Answer 2

For me, simple css doesn't work, you have to use LESS ...
Use separate classes so that they can be repeated anywhere.

CSS <a> , - .pagination,

Answer 3

.parent-class .pagination{
   font-size: 10px
}
.parent-class .pagination > a {
   font-size: 30px
}

Answer 4

:

.parent-class .pagination {
    font-size: 10px
}
.parent-class .pagination a{
    font-size: 30px
}

Answer 5

HTML-

<div class="parent-class">
    <div class="pagination"></div>
    <a>Example with font-size 30px</a>
</div>

You need the following CSS classes:

.parent-class { /* define parent class properties here */ }
.parent-class .pagination {
    font-size: 10px
 }
 .parent-class a {
    font-size: 30px
 }
 ...............

NOTE. The div position with the class .pagination and "a" -tag is not important in this case. They will be affected by the CSS rules that you specify, regardless of where they are inside the div.parent div class. If you need a selector that only matches children, when they are DIRECT descendants of this element, you need something like this :

.parent-class { /* define parent class properties here */ }
/* '>' selects all elements with .pagination class, which have a parent element with class .parent-class */
.parent-class > .pagination {
    font-size: 10px
 }
 .parent-class > a {
    font-size: 30px
 }
 ...............