练习做了一个京东首页，使用不同浏览器测试了一下，发现了不少的问题，做一下总结。
地址：https://zhangcuizc.github.io/jd-new/
1、IE10
在IE10中基本正常，主要的问题是设置了链接的图片在IE10中都会有一个边框，不仅丑而且导致部分地方布局混乱，当然解决方法也很简单，在reset.css中重置所有图片的边框样式即可：
img{
border:none;
}
2、IE9
IE9中主要有两个问题，一是不支持linear-gradient，所以使用渐变作为背景色会失效。比如正常情况下：
代码如下：
.lovelife-list-item1 .lovelife-list-title{
background: -webkit-linear-gradient(left, #974676, #9e4075);
background: -o-linear-gradient(left, #974676, #9e4075);
background: linear-gradient(to right, #974676, #9e4075);
}
在支持linear-gradient中使用当然不会有问题，但如果在IE9中，那么这样的代码就会导致没有背景色，最简单的解决办法是做降级处理，加上一句背景色声明即可，毕竟渐变还是纯色有时候影响并不大，或者根本看不出来：
.lovelife-list-item1 .lovelife-list-title{
background-color: #974676;
background: -webkit-linear-gradient(left, #974676, #9e4075);
background: -o-linear-gradient(left, #974676, #9e4075);
background: linear-gradient(to right, #974676, #9e4075);
}
这样会在不支持渐变的情况下显示背景色，比如：
不过虽然问题解决了，我还是有一些疑问，在不支持linear-gradient的情况下只会应用bgc声明，这个好理解，可是在支持渐变的情况下，为什么即使改变了bgc声明的位置，渐变的声明也不会被覆盖呢，不都是颜色嘛？难道是bgc声明和bg的声明还有优先级？查了查CSS权威指南，好像没有这个说法。又在网上查了查，发现，还真不都是颜色。bgc声明的是背景色无误，然而linear-gradient是一个渐变图像！linear-gradient更具体的声明是background-image：linear-gradient(to right, #974676, #9e4075)，这也就解释了为什么它们不会互相影响。
所以使用渐变的时候，一定要设置背景色！
在IE9中遇到的另一个问题是transtion过渡效果无效。
在这里实现的效果是利用transform和transtion实现鼠标悬浮在图片上时图片有一个移动的动画效果。由于transtion在IE9中无效，而transform在IE9中经过-ms-后是有效的，导致的结果就是很生硬的移动效果。看了看京东原版的页面，解决办法是在支持transition的情况下，给html标签设置一个特定的class，比如csstranstion，然后：
.csstranstion moveleft:hover{
//tranform
//transtion
}
这样的话在IE9中由于没有csstranstion类，所以:hover动画便无效，京东够能偷懒的，简单粗暴的解决办法……
检测浏览器是否支持transtion的jq方法：
// jQuery.support.transition
// to verify that CSS3 transition is supported (or any of its browser-specific implementations)
$.support.transition = (function(){
var thisBody = document.body || document.documentElement,
thisStyle = thisBody.style,
support = thisStyle.transition !== undefined || thisStyle.WebkitTransition !== undefined || thisStyle.MozTransition !== undefined || thisStyle.MsTransition !== undefined || thisStyle.OTransition !== undefined;
return support;
})();
来源：http://mengqing.org/archives/jquery-browser-transition.html
3、Chrome
在强大的Chrome面前出现一个大问题，我知道是我代码写得不好……感觉firefox更强大，写再烂的代码都没有太大的问题。。
页面中有fixed的元素时，在鼠标滑过transtion和transform的动画时，很大几率造成fixed元素的闪动。
虽然知道问题出在transtion和transform，不过目前还没有找到更好的解决办法，有解决办法再来补充。