ZAPPER'S Blog

作者：幻轩 （博客地址：http://ubshop.cn/blog）

相信大家在制作模板时,最~最头痛的就是IE跟Firefox的兼容性问题!现在可以很好地解决这个问题!
详细讲解实现方法
1.styles.css (所有浏览器都调用的css共公文件)
  例如: #menu { }的定义在IE ,Firefox,Opera显示不一致,那么你不要将#menu { }放入styles.css中.而是放入下面的css文件中.
2.ie.css ( 只有IE才调用的CSS文件.将#menu { }放入这,就可在IE中独立定义)
3.Firefox.css(只有Firefox才调用的CSS文件.将#menu { }放入这,就可在Firefox中独立定义)
4.Opera.css(只有Opera才调用的CSS文件.将#menu { }放入这,就可在Opera中独立定义)
5.x.css(其它不知名浏览器,建议调入Firefox的定义就行)

注意:这5个CSS文件,放在风格文件的根目录.
请不要使用记事本编辑本文件!!推荐使用EditPlus编辑!保存时选择UTF-8编码!

下面是实现这功能的JS代码(你也可以下载附件中调试好的elements.php文件)

<SCRIPT language=JavaScript> <!-- //根据不同的浏览器调用不同的CSS! if (window.navigator.userAgent.indexOf("MSIE")>=1) { document.write('<link media="screen" href="template/{$template['dirname']}/ie.css" type="text/css" rel="stylesheet" />'); }   else{       if (window.navigator.userAgent.indexOf("Firefox")>=1)       {       document.write('<link media="screen" href="template/{$template['dirname']}/Firefox.css" type="text/css" rel="stylesheet" />');       }     else{               if (navigator.appName=="Opera")               {               document.write('<link media="screen" href="template/{$template['dirname']}/Opera.css" type="text/css" rel="stylesheet" />');               }         else{               document.write('<link media="screen" href="template/{$template['dirname']}/x.css" type="text/css" rel="stylesheet" />');              }      }      }   //--> </SCRIPT>

elements.php 文件下载: