在建站，采用CSS+DVI，遇到这样一个问题，请大家讨论

#info_bar{
 background:url(/images/info_bar_bg.jpg);   /*待修改*/
 height:30px;
 overflow:hidden;  /*重要，防止div被公告撑开*/
 font-size:14px;
}

#info_bar span{height:30px;}

  #info_bar .common{float:left;padding-top:8px;margin-left:10px;}
  
    #info_bar .title{font-weight:bold;}
    #info_bar .with_image{padding-left:30px;}
    #info_bar .announce{background:url(/images/announce_ico.gif) no-repeat 0 5px;}
    #info_bar .menuDiv {width:1px;background:#ccc;}

#info_bar下面有几个span，属性各有相同和不同，为了以后维护方便，打算采用以上的定义方式，这样以后维护只要改一次属性值就可以了，没有冗余代码，而且容易保持视觉一致性，但这样有个缺点，在html中引用的时候需要对每个span赋予多个class属性，如以下代码，不太方便，也不简洁

<div id="info_bar">
<span class="common title with_image announce">网站公告</span>
<span class="common menuDiv"></span>
<span class="common"><a href="javascript:window.close()">关闭窗口</a></span>
</div> 

能不能有这样的方式定义css

common title with_image announce相加，类似于程序中的加法，得到一个新类，这样引用时方便，而且维护时，只要修改common title with_image announce等，新类自动更新

或者对这样的CSS定义大虾们有什么其他高招，望不吝赐教！