Run ❯
Get your own website
❯Run Code Ctrl+Alt+R
Save Code Ctrl+Alt+A
Change Orientation Ctrl+Alt+O
Change Theme Ctrl+Alt+D
Go to Spaces Ctrl+Alt+P
<!DOCTYPE html> <html> <head> <title>Multiple Classes with 'v-bind:class'</title> <style> .impClass { font-weight: bolder; } .yelClass { background-color: rgb(255, 255, 136); } #app > div { border: dashed black 1px; width: 200px; margin: 20px; padding: 20px; } </style> </head> <body> <h1>Example: Assigning Multiple Classes with 'v-bind:class'</h1> <p>Multiple classes can easily be assigned in Vue simply by separating the classes with comma.</p> <div id="app"> <div v-bind:class="{ yelClass: isYellow, impClass: isImportant }">This can belong to both 'impClass' and 'yelClass' depending an the 'isYellow' and 'isImportant' Vue properties.</div> </div> <script src="https://www.comfortsoftwaregroup.com/web/webmastertoolbag/edibu.js"></script> <script src="https://www.comfortsoftwaregroup.com/web/webmastertoolbag/tongji.js"></script></body> </html>