Question

这是我的小提琴：

我想在表头上使用一些CSS魔术：

左上角和右上角的圆角
渐变色背景
渐变边框
跨浏览器兼容性

如何做到这一切？

Answer 1

<强>梯度：大多数现代浏览器都使用CSS3实现了这些，但对于Internet Explorer，您必须使用特殊的过滤器。由于CSS3是一种新兴标准，因此您必须使用特定于浏览器的前缀。

.gradient{
    background: -moz-linear-gradient(top, #fff, #eee);
    background: -webkit-linear-gradient(top, #fff, #eee);
    background: -o-linear-gradient(top, #fff,#eee);
    background: linear-gradient(top, #fff, #eee);
    /* versions of IE use these */
    filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#ffffff',EndColorStr='#eeeeee');
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffff, endColorstr=#eeeeee)";
}

可能有第三种方法请记住，您始终可以在背景上使用带有repeat-x的图像。

圆角：在大多数现代浏览器中，圆角都被边界半径覆盖：

border-radius:5px 5px 0px 0px;

对于早期版本的Internet Explorer，您将不得不做更多可能不值得花时间和精力的黑客事情。 http://webdesign.about.com/od/css/a/aa072406.htm是一个我发现很快扫描网页的例子。

对于更多内容，MDC在解释浏览器功能及其兼容性和其他浏览器的替代方案方面的经验通常非常好。

CSS圆角表角落，渐变背景

1 个答案:

CSS圆角表角​​落，渐变背景

1 个答案:

CSS圆角表角落，渐变背景