让ie78支持background-size和nth-child

一、让ie支持background-size

      网站中为了使图片比较清晰，因此把icon的尺寸都放大了二倍，再通过background-size缩小到想要的大小。原本是没打算兼容低版本ie，就这样放开的做了起来。最后，产品说要兼容低版本浏览器ie8。于是头疼的事情出现了

       本来是想通过两套图片解决，支持background-size的用大图。然后不支持的ie用hack使用小图。后来前端另一个同学发过来一篇文章，说可以解决低版本ie支持background-size。它是一个.htc的文件，也类似于js脚本文件。点击https://github.com/louisremi/background-size-polyfill进入官网

.htc文件

       抱着试试的想法把文件放在相应的目录下，然后css中有用到background-size的地方加上behavior:url(backgroundsize.min.htc);

然后用ie8浏览发现确实是支持了background-size属性了。

引入.htc

       这样的好处是：不用再做两套图片了。

       但麻烦的是：每一个有background-size的地方都需要加上那两行代码。后期一个一个加的话比较麻烦。

       坑：发现input标签图片的background-size 时加上这两句，在IE低版本里面就不再生效。这样针对input的标签还是需要做两套图。

二、让ie支持nth-child属性

如  .fl-block-3:nth-child(2)  这个样式ie8不支持，兼容写法为

.fl-block-3:first-child+div

如果为nth-child(3) 就写成  .fl-block-3:first-child + div + div

此方法适合于比较少的子元素。否则如果有几十个元素，后面要加几十个div吗