让谷歌浏览器 chrome 支持小于12px的字体
webkit的私有属性:{-webkit-text-size-adjust:none;} 但是,在最新版的谷歌里。已经不在支持这个属性啦。 用css3的transform:scale()缩放大小,但是缩放的宽度是不会改变的。所以额外加了个span标签, 又用了另外的 专门给chrome的样式 @media screen and (-webkit-min-device-pixel-ratio:0) { } 另外:火狐 @-moz-document url-prefix() { } #nav { width:100%; height:34px; background-color:#000; } #nav ul {} #nav ul li { float:left; margin-right:3px; } #nav ul li a { float:left; font-size:11px; display:block; height:34px; line-height:34px; color:#fff; text-transform:uppercase; } #nav ul li a:hover,#nav ul li a.selected { background-color:#313131; text-decoration:none; } #nav ul li a span { padding:0px 22px; display:block; } @media screen and (-webkit-min-device-pixel-ratio:0) { #nav ul li a span { padding:0px 15px; -webkit-transform:scale(0.916); -o-transform:scale(1); } } <div id="nav"> <div class="pagewraper"> <ul id="top_Menu"> <li><a href="Index.php" ><span>home</span></a></li> <li><a href="Company.php" ><span>company</span></a></li> <li><a href="Machinery.aspx"><span>machinery parts</span></a></li> <li><a href="Rigging.aspx"><span>rigging hardware</span></a></li> <li><a href="Heat.aspx"><span>heat exchanger</span></a></li> <li><a href="Qa.php"><span>quality assurance</span></a></li> <li><a href="Qualification.php"><span>qualification</span></a></li> <li><a href="Contact.php"><span>contact us</span></a></li> </ul> </div> </div>
会饮酒时为伴侣,再逢天下平.