“线性渐变”在IE9和Safari中无效

时间:2015-06-04 14:15:03

标签: html css css3 internet-explorer safari

我尝试将一种风格应用于按钮,但这种风格在Mozilla和Chrome上显示得很好,那么Safari和IE9就不是这样了。

这是css类:

#bt_D{
width:130px;
height:30px;
box-shadow:1px 2px 4px rgba(0,0,0,0.60);
font-size:12px;
background-image:linear-gradient(60deg, rgb(231,110,49), rgb(231,171,49));
border:1px solid rgb(180,180,180);
border-radius:5px;
float:right;
text-align:center;
vertical-align:middle;
}

但是当我检查按钮时,我在引用属性linear-gradient时发现一个黄色感叹号,表示浏览器无法识别此属性(safari或IE9)

有什么想法解决这个问题?

1 个答案:

答案 0 :(得分:0)

对于Safari,您必须添加一个额外的,所谓的“供应商前缀”版本的定义:

col-sm-7

对于IE9(不支持CSS渐变),您必须使用图像作为后备,png / gif / jpg或更好的SVG。

以下是许多梯度生成器中的一个,它还可以创建所需的SVG:

  

http://www.colorzilla.com/gradient-editor/