[分享]css兼容ie9写法

随着互联网技术的发展，Web前端技术也日新月异。为了让网页在不同浏览器上有良好的显示效果，我们需要写兼容各浏览器的代码，尤其是一些老版本的浏览器，比如IE9。/ 这里是CSS代码示例 / .box {...

随着互联网技术的发展，Web前端技术也日新月异。为了让网页在不同浏览器上有良好的显示效果，我们需要写兼容各浏览器的代码，尤其是一些老版本的浏览器，比如IE9。

/* 这里是CSS代码示例 */
.box {
  display: inline-block;
  width: 100px;
  height: 100px;
  background-color: red;
  *display: inline; /* 兼容IE7及以下版本 */
  *zoom: 1; /* 兼容IE7及以下版本 */
  /* 为了兼容IE9，我们需要增加以下代码 */
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; /* IE9 */
  filter: alpha(opacity=80); /* IE8及以下版本 */
  opacity: 0.8; /* Firefox、Chrome、Safari、Opera等现代浏览器 */
} 

在上面这段CSS代码中，我们为了兼容IE9，特地加了一个-Microsoft前缀的过滤器以及一个opacity属性，这样才能让IE9正确地读取透明度。另外，我们还用了*display和*zoom这两个Hack来兼容IE7及以下版本，因为在那些版本中display: inline-block这条属性是不被支持的。

总之，CSS兼容性问题是Web前端开发中必不可少的一部分。要想写出能兼容各种浏览器的代码，我们需要多加研究和实践，才能让我们的网站在各种浏览器上都能有良好的显示效果。