How to Add Multiple Classes to an HTML Element?

You can add multiple classes to an HTML element by separating each one by a space in the element's class attribute, for example, like so:

<span class="one two three">
    foo bar
</span>

To select the HTML element in CSS using multiple class names, you can do the following:

.one.two.three { /* ... */ }
.one.two { /* ... */ }
/* ... */

This post was published by Daniyal Hamid. Daniyal currently works as the Head of Engineering in Germany and has 20+ years of experience in software engineering, design and marketing. Please show your love and support by sharing this post.