css - How to control priority of class specification -

i have dom elements have classes foo , bar:

<div class="foo bar">...</div> 

and want control priority between them. following w3c specification on this, thought adding selectors css might make priority higher. example, if wanted foo override bar, thinking of putting dummy class this:

.foo, .dummy{   ... }  .bar{   ... } 

will work? there better way this? know !important can control individual attributes, want more general solution controls priority of entire class specification.

if first add rule .bar class , .foo, .foo rules overide .bar's

example:

.bar {     color : red; }  .foo {     color: blue; } 

the color of div blue.

what proposed work, need add dummy class div (so css selector match)

example:

<div class="foo bar dummy">...</div>