Can I apply 2 classes to a single div
or span
or any HTML element? For example:
<a class="c1" class="c2">aa</a>
I tried and in my case c2
does not get applied. How can I apply both classes at once?
An element is usually only assigned one class. The corresponding CSS for that particular class defines the appearance properties for that class. However, we can also assign multiple classes to the same element in CSS.
HTML elements can be assigned multiple classes by listing the classes in the class attribute, with a blank space to separate them.
Multiple ClassesHTML elements can belong to more than one class. To define multiple classes, separate the class names with a space, e.g. <div class="city main">. The element will be styled according to all the classes specified.
Use the getElementsByClassName method to get elements by multiple class names, e.g. document. getElementsByClassName('box green') . The method returns an array-like object containing all the elements that have all of the given class names.
1) Use multiple classes inside the class attribute, separated by whitespace (ref):
<a class="c1 c2">aa</a>
2) To target elements that contain all of the specified classes, use this CSS selector (no space) (ref):
.c1.c2 { }
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