用js控制css的不错的方法

<style type="text/css"> #tabs ul {display: inline; padding-left: 0px; margin-left: 10px; white-space: nowrap} #tabs ul li {border-right: #999 1px solid; padding-right: 8px; border-top: #999 1px solid; display: inline; padding-left: 12px; font-size: x-small; background: #eee; padding-bottom: 0px; border-left: #999 1px solid; margin-right: 2px; padding-top: 3px; border-bottom: #4bcb66 0px solid; font-family: verdana; white-space: nowrap} #tabs ul li.active_web {border-right: #4bcb66 1px solid; padding-right: 8px; border-top: #4bcb66 1px solid; padding-left: 12px; font-weight: bold; font-size: x-small; background: #f7fdf6; padding-bottom: 0px; border-left: #4bcb66 1px solid; padding-top: 6px; border-bottom: #f7fdf6 1px solid; font-family: verdana; white-space: nowrap} #tabs ul li.active_news {border-right: #d3bf8e 1px solid; padding-right: 8px; border-top: #d3bf8e 1px solid; padding-left: 12px; font-weight: bold; font-size: x-small; background: #fff9eb; padding-bottom: 0px; border-left: #d3bf8e 1px solid; padding-top: 6px; border-bottom: #fff9eb 1px solid; font-family: verdana; white-space: nowrap} </style> <div id="tabs"> <span id="logo"></span> <ul> <li id="l1" class="active_web"> <span class="active_web_text" id="cnsp"> <a href="#" onclick="javascript:cntable()" onfocus="blur()">中文搜索</a></span> </li> <li id="l2"> <span id="ensp"> <a href="#" onclick="javascript:entable()" onfocus="blur()">英文搜索</a></span> </li> <li id="l3"> <span id="bigsp"> <a href="#" onclick="javascript:bigtable()" onfocus="blur()">国内门户</a></span> </li> <li id="l4"> <span id="othersp"> <a href="#" onclick="javascript:othertable()" onfocus="blur()">综合其它</a></span> </li> </ul> </div>
[ctrl+a 全选 注:如需引入外部js需刷新才能执行]