css 写箭头兼容ie8

CSS是网页设计中非常重要的一部分，它可以让我们轻松地控制页面元素的样式和布局。然而，在写CSS时有一个常见的问题就是如何在兼容性上面支持旧版的浏览器，比如IE8等。接下来我们来看看如何用CSS写箭头并兼容IE8。

.arrow {
        width: 0;
        height: 0;
        border: 10px solid transparent;
        border-left-color: black;
        display: inline-block;
}
.arrow_ie8 {
        display: inline-block;
        width: 0;
        height: 0;
        border: 10px solid transparent;
        border-left-color: black;
        zoom: 1;
        *display: inline;
 /* IE8 hack */}
    

上面的代码中，我们定义了一个箭头的样式，通过设置border的边框宽度和颜色达到箭头的效果。这个箭头样式可以兼容大部分现代浏览器，但是在IE8中会有兼容性问题。因为IE8不支持CSS的伪类选择器，无法对其进行修饰。

为了解决这个问题，我们需要使用hack（黑科技）来解决。我们给IE8的箭头样式添加一个zoom:1的属性，这样就可以触发IE8的haslayout属性，让箭头正确显示。同时加上*display:inline的hack，以便让这个修饰生效。

总结一下，使用CSS写箭头时，我们需要保证其在不同版本的浏览器中都能正确显示。为了解决IE8兼容性问题，我们需要使用zoom:1和*display:inline这些hack，以确保箭头能够正确显示。这样，我们就可以愉快地使用箭头样式了！

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！