如果完全可以不考虑低版本浏览器用户的就不用去纠结小部分代码问题
然后具体事情具体分析
js的兼容可以借助框架和库 比如jquery,或者自己写个方法判断和兼容该浏览器
css的兼容 其实在养成良好代码习惯和思路之后 能遇上的兼容问题其实是非常少的,很针对性的可以写一点hack,但不要多用
有两种方法：
1、在同一个CSS样式表中，使用 !important 来定义不同的值以适应Firefox和IE。
例如：
padding: 20px !important/For Firefox/
padding: 10px/For IE/
（注意这里IE6是无法识别，important 这个标记的，但它会识别padding: 20px，所以要在后面加上padding: 10px用来覆盖padding: 20px）这个方法适用于修改少量代码。
2、条件注释。（只对IE浏览器有效）这也是北极冰仔部落格目前使用的方法。先为不同浏览器书写各自的CSS样式，再在head中加入以下的代码以适应不同的IE浏览器版本调用：
注意：
gt: greater than （高于）
lte: less than or equal to （低于或等于）
另外：IE还支持一个非标准的标签：comment
This is not Internet Explorer.
This is Internet Explorer.
IE会自动把此标签中的内容当作注释处理掉。
扩展资料
关于css兼容性问题及一些常见问题
目前主流浏览器的兼容性做的都比较好了，以下主要针对IE6，7的不兼容问题进行解决。
1、有浮动存在时，计算一定要精确，不要让内容的宽高超出我们所设置的宽高，IE6下，内容会撑开设置好的高度。
解决方法：给对应的父级加overflow:hidden但是会有部分被隐藏掉，最好是精确计算宽高再设定。
2、在IE6下有元素浮动时，如果宽度需要由内容撑开，就给里边的块元素都加浮动，正常浏览器不用加浮动。
3、在IE6下元素的高度的小于19px的时候，会被当做19px来处理。
解决办法：添加overflow:hidden
CSS3的动画的优点：1.在性能上会稍微好一些，浏览器会对CSS3的动画做一些优化（比如专门新建一个图层用来跑动画）
2.代码相对简单
但其缺点也很明显：
1.在动画控制上不够灵活
2.兼容性不好
3.部分动画功能无法实现（如滚动动画，视差滚动等）
JavaScript的动画正好弥补了这两个缺点，控制能力很强，可以单帧的控制、变换，同时写得好完全可以兼容IE6，并且功能强大。但想想CSS动画的transform矩阵是C++级的计算，必然要比javascript级的计算要快。另外对库的依赖也是一个很让人头疼的问题。
所以，对于一些复杂控制的动画，使用javascript会比较靠谱。而在实现一些小的交互动效的时候，就多考虑考虑CSS吧。
