背景渐变在 IE10 中渲染不正确
background gradient not rendering correcty in IE10
#top_container
{
padding-bottom: 5px;
background: #d1d1ff;
background: -webkit-gradient(linear, left top, left bottom, from(#7db9e8), to(#1e5799));
background: -moz-linear-gradient(#d1ffff, #d1d1ff);
background: -o-linear-gradient(#d1ffff, #d1d1ff);
background: -webkit-linear-gradient(#d1ffff, #d1d1ff);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d1ffff', endColorstr='#d1d1ff',gradientType=0 );
background: -ms-linear-gradient(top, #d1ffff 30%, #d1d1ff 100%);
background:linear-gradient(to bottom, #d1ffff 30%, #d1d1ff 70%);
}
除了在 IE10 中,渐变显示正确 - 我搜索了其他可能的语法版本,并尝试了 -ms-linear-gradient 和 linear-gradient 的许多不同版本。
还有什么可能导致此内容无法显示。容器中正在显示背景#d1d1ff。
jsFiddle built using Ultimate CSS Gradient Generator。为此,网上有很多工具!添加了一个最小高度,以便它可以在 jsFiddle 上正确显示,如果您复制此代码,请确保将其删除。
CSS:
#top_container {
min-height: 200px;
padding-bottom: 5px;
background: #d1ffff;
background: -moz-linear-gradient(top, #d1ffff 0%, #d1d1ff 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d1ffff), color-stop(100%,#d1d1ff));
background: -webkit-linear-gradient(top, #d1ffff 0%,#d1d1ff 100%);
background: -o-linear-gradient(top, #d1ffff 0%,#d1d1ff 100%);
background: -ms-linear-gradient(top, #d1ffff 0%,#d1d1ff 100%);
background: linear-gradient(to bottom, #d1ffff 0%,#d1d1ff 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d1ffff', endColorstr='#d1d1ff',GradientType=0 );
}
#top_container
{
padding-bottom: 5px;
background: #d1d1ff;
background: -webkit-gradient(linear, left top, left bottom, from(#7db9e8), to(#1e5799));
background: -moz-linear-gradient(#d1ffff, #d1d1ff);
background: -o-linear-gradient(#d1ffff, #d1d1ff);
background: -webkit-linear-gradient(#d1ffff, #d1d1ff);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d1ffff', endColorstr='#d1d1ff',gradientType=0 );
background: -ms-linear-gradient(top, #d1ffff 30%, #d1d1ff 100%);
background:linear-gradient(to bottom, #d1ffff 30%, #d1d1ff 70%);
}
除了在 IE10 中,渐变显示正确 - 我搜索了其他可能的语法版本,并尝试了 -ms-linear-gradient 和 linear-gradient 的许多不同版本。
还有什么可能导致此内容无法显示。容器中正在显示背景#d1d1ff。
jsFiddle built using Ultimate CSS Gradient Generator。为此,网上有很多工具!添加了一个最小高度,以便它可以在 jsFiddle 上正确显示,如果您复制此代码,请确保将其删除。
CSS:
#top_container {
min-height: 200px;
padding-bottom: 5px;
background: #d1ffff;
background: -moz-linear-gradient(top, #d1ffff 0%, #d1d1ff 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d1ffff), color-stop(100%,#d1d1ff));
background: -webkit-linear-gradient(top, #d1ffff 0%,#d1d1ff 100%);
background: -o-linear-gradient(top, #d1ffff 0%,#d1d1ff 100%);
background: -ms-linear-gradient(top, #d1ffff 0%,#d1d1ff 100%);
background: linear-gradient(to bottom, #d1ffff 0%,#d1d1ff 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d1ffff', endColorstr='#d1d1ff',GradientType=0 );
}