IE9边界半径和背景渐变出血

IE9显然能够通过使用border-radius的CSS3标准定义来处理圆angular。

那么支持边界半径和背景渐变呢？ 是的IE9是分别支持他们，但如果你混合两个梯度stream血圆angular。

我也看到阴影在一个带有圆angular的盒子下面显示为一条黑色的阴影。

以下是IE9中显示的图像：

图像没有流血，但尖锐的角落流血的图像

我该如何解决这个问题？

以下是一个增加背景渐变的解决scheme，使用数据URI创build覆盖任何背景色的半透明图像。 我已经validation它在IE9中的边界半径上被正确剪辑。 这比基于SVG的build议重量轻，但作为缺点，不是解决scheme无关的。 另一个好处：与您当前的HTML / CSS一起工作，不需要用额外的元素进行包装。

我通过networkingsearch抓取了一个随机的20×20渐变PNG，并使用在线工具将其转换为数据URI。 得到的数据URI比所有那些SVG混乱的CSS代码要小，更不用说SVG本身了！ （你可以只使用条件样式，特定于浏览器的CSS类等来有条件地将其应用于IE9）。当然，生成PNG对于button大小的渐变非常适用，但不适用于页面大小的渐变！

HTML： 

 <span class="button">This is a button</span>

CSS： 

 span.button { padding: 5px 10px; border-radius: 10px; background-color: orange; background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAvUlEQVQ4y63VMQrDMAyF4d/BGJ+rhA4dOnTo0Kn3P4ExxnSoXVQhpx0kEMmSjyfiKAF4AhVoqrvqjXdtoqPoBMQAPAZwhMpaYkAKwH1gFtgG0v9IlyZ4E2BVabtKeZhuglegKKyqsWXFVboJXgZQfqSUCZOFATkAZwEVY/ymQAtKQJ4Jd4VZqARnuqyxmXAfiAQtFJEuG9dPwtMC0zD6YXH/ldAddB/Z/aW4Hxv3g+3+6bkvB/f15b5gXX8BL0z+tEEtuNA8AAAAAElFTkSuQmCC); background-size: 100% 100%; border: 2px solid white; color: white; }

我也一直在处理这个问题。 另一个“解决scheme”是在具有渐变和圆angular的物品周围添加一个div。 使该div具有相同的高度，宽度和圆angular值。 将溢出设置为隐藏。 这基本上只是一个面具，但它适用于我。

HTML： 

 <div class="mask roundedCorners"> <div class="roundedCorners gradient"> Content </div> </div>

CSS： 

 .mask { overflow: hidden; } .roundedCorners { border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; } .gradient { filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0065a4', endColorstr='#a0cf67',GradientType=0 ); /* IE6-9 */ }

我认为值得一提的是，在很多情况下，您可以使用插入的阴影来“伪造”渐变效果，避免IE9中的丑陋边缘。 这对于button尤其适用。

看到这个例子： http : //jsfiddle.net/jancbeck/CJPPW/31/

按钮样式与线性渐变或方块阴影的比较

你也可以使用CSS3 PIE来解决这个问题：

http://css3pie.com/

当然，如果你仅仅依赖于一个带有圆angular和背景渐变的元素，这可能是矫枉过正的，但是如果你在你的页面中包含了一些常见的CSS3特性并且想要简单的支持为IE6 +

我也遇到了这个bug。 我的build议是将重复的背景图像用于ie9中的渐变。 IE9正确地平铺圆形边框后面的图像（从RC1开始）。

我看不出如何编写100行代码来replace1行CSS是简单或优雅的。 SVG是很酷的，但为什么在渐变背景的解决scheme已经存在多年的时候经历了这一切。

我也陷在了同样的问题n发现IE不能一次渲染边界半径和渐变，它们都是冲突的，解决这个问题的唯一方法就是去掉filter，并通过svg代码使用渐变，只是为了IE

你可以通过使用他们的渐变颜色代码，从微软这个网站（专门为渐变svg）获得svg代码：

http://ie.microsoft.com/testdrive/graphics/svggradientbackgroundmaker/default.html

请享用 ：）

只需使用一个包装div（四舍五入和溢出隐藏）剪辑IE9的半径。 简单，作品跨浏览器。 SVG，JS和条件注释是不必要的。 

 <div class="ie9roundedgradient"><div class="roundedgradient">text or whatever</div></div> .ie9roundedgradient { display:inline-block; overflow:hidden; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; } .roundedgradient { -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; /* use colorzilla to generate your cross-browser gradients */ }

这个博客文章帮助了我： http : //abouthalf.com/2010/10/25/internet-explorer-9-gradients-with-rounded-corners/

基本上，您使用条件注释来删除filter，然后创build可用作背景图像的渐变的SVG“精灵”。

简单而优雅！

IE9正确处理边界半径和渐变。 问题是除了渐变，IE9渲染filter是正确的。 正确解决这个问题的方法是在使用filter属性的样式声明中禁用filter。

作为如何最好地解决这个问题的一个例子：

您的主样式表中有一个button类。 

 .btn { background: linear-gradient(to bottom, #1e5799 0%,#7db9e8 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#7db9e8',GradientType=0 ); }

在条件IE9样式表中： 

 .btn { filter: none; }

只要IE9样式表在你的主样式表后面被引用，这将完美地工作。

有一个简单的方法，使其工作在IE9下只有一个元素。

看看这个小提琴： http : //jsfiddle.net/bhaBJ/6/

第一个元素设置边界半径。 第二个伪元素设置背景渐变。

几个关键说明：

  • 家长必须具有相对或绝对的地位
  • 父母必须有溢出：隐藏 ; （为了使边界半径效应可见）
  • :: before（或:: after）伪元素必须有z-index：-1 （解决方法种类）

基本元素声明如下所示： 

 .button{ position: relative; overflow: hidden; /*make childs not to overflow the parent*/ border-radius: 5px; /*don't forget to make it cross-browser*/ z-index:2; /*just to be sure*/ }

伪元素声明： 

 .button:before{ content: " "; /*make it a node*/ display: block; position: absolute; top:0;left:0;bottom:0;right:0; /*same width and height as parent*/ z-index: -1; /*force it to NOT overlay the TEXT node*/ /*GRADIENT declarations...*/ background: -ms-linear-gradient(top, #ff3232 0%,#7db9e8 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff3232',endColorstr='#7db9e8',GradientType=0 ); }

我决定从四舍五入禁用IE9来解决这个错误。 这是干净，简单和通用的可用。 

 { border-radius:10px; border-radius:0px \0/; background:linear-gradient(top , #ffeecc, #ff8800); /* ... (-moz -ms,-o, -webkit) gradients */ filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#ffeecc,endColorstr=#ff8800); }

在IE9的面具div是一个好主意。 我提供了一些完整的代码来帮助澄清一点。 虽然我不喜欢在DIV中包装button，但我认为比embeddedPNG蒙版或使用SVG完成所有工作更容易理解。 也许IE 10会正确支持它。 

 <!DOCTYPE html> <html> <head> <title>Button Test</title> <style> .btn_mask { cursor:pointer;padding:5px 10px;border-radius:11px 11px 11px 11px; background-color:transparent;-moz-border-radius:11px 11px 11px 11px; -webkit-border-radius:11px 11px 11px 11px;overflow:hidden;padding:0px; float:left; } .btn { cursor:pointer;text-decoration:none;border:1px solid rgb(153,153,153); padding:5px 10px;color:rgb(0,0,0);font-size:14px;font-family:arial,serif; text-shadow:0px 0px 5px rgb(255,255,255);font-size:14px; border-radius:11px 11px 11px 11px;-moz-border-radius:11px 11px 11px 11px; -webkit-border-radius:11px 11px 11px 11px;box-shadow:0px 0px 0px rgb(0,0,0); -moz-box-shadow:0px 0px 0px rgb(0,0,0); -webkit-box-shadow:0px 0px 0px rgb(0,0,0);background-color:rgb(255,204,0); background-image:linear-gradient(-90deg,rgb(255,255,153),rgb(255,204,0)); background-image:-webkit-gradient(linear,50% 0%,50% 100%,from(rgb(255,255,153)),to(rgb(255,204,0)));-ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorStr='#ffffff', EndColorStr='#ffcc00)')";background-image:-moz-linear-gradient(-90deg,rgb(255,255,153),rgb(255,204,0)); } .btn:hover { cursor:pointer;text-decoration:none; border:1px solid rgb(153,153,153); padding:5px 10px 5px 10px; color:rgb(0,0,0); font-size:14px; font-family:arial,serif; text-shadow:0px 0px 5px rgb(255,255,255); font-size:14px; border-radius:11px 11px 11px 11px; -moz-border-radius:11px 11px 11px 11px; -webkit-border-radius:11px 11px 11px 11px; box-shadow:0px 0px 0px rgb(0,0,0); -moz-box-shadow:0px 0px 0px rgb(0,0,0); -webkit-box-shadow:0px 0px 0px rgb(0,0,0); background-color:rgb(255,255,0); background-image:linear-gradient(-90deg,rgb(255,255,0),rgb(255,255,153)); background-image:-webkit-gradient(linear,50% 0%,50% 100%,from(rgb(255,255,0)),to(rgb(255,255,153))); background-image:-moz-linear-gradient(-90deg,rgb(255,255,0),rgb(255,255,153)); } </style> </head> <body> <form name='form1'> <div class='btn_mask'><input type='button' class='btn' value='a button'></div> <div class='btn_mask'><input type='button' class='btn' value='a button'></div> <div class='btn_mask'><input type='button' class='btn' value='a button'></div> <div class='btn_mask'><input type='button' class='btn' value='a button'></div> </form> </body> </html> 
 background: #4f81bd; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzRmODFiZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM4YWJiZDciIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(left, #4f81bd 0%, #8abbd7 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, right top, color-stop(0%,#4f81bd), color-stop(100%,#8abbd7)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(left, #4f81bd 0%,#8abbd7 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(left, #4f81bd 0%,#8abbd7 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(left, #4f81bd 0%,#8abbd7 100%); /* IE10+ */ background: linear-gradient(left, #4f81bd 0%,#8abbd7 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4f81bd', endColorstr='#8abbd7',GradientType=1 ); /* IE6-8 */

是这样对我，一旦我删除了“filter：”线，stream血消失了。 另外我使用PIE。

出血： 

  background: #8abbd7; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzhhYmJkNyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM0ZjgxYmQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #8abbd7 0%, #4f81bd 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#8abbd7), color-stop(100%,#4f81bd)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #8abbd7 0%,#4f81bd 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #8abbd7 0%,#4f81bd 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #8abbd7 0%,#4f81bd 100%); /* IE10+ */ background: linear-gradient(top, #8abbd7 0%,#4f81bd 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8abbd7', endColorstr='#4f81bd',GradientType=0 ); /* IE6-8 */ -pie-background: linear-gradient(#8ABBD7, #4f81bd); behavior: url(../PIE/PIE.htc);

不stream血： 

  background: #8abbd7; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzhhYmJkNyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM0ZjgxYmQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #8abbd7 0%, #4f81bd 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#8abbd7), color-stop(100%,#4f81bd)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #8abbd7 0%,#4f81bd 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #8abbd7 0%,#4f81bd 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #8abbd7 0%,#4f81bd 100%); /* IE10+ */ background: linear-gradient(top, #8abbd7 0%,#4f81bd 100%); /* W3C */ -pie-background: linear-gradient(#8ABBD7, #4f81bd); behavior: url(../PIE/PIE.htc);

快速IE阴影修复： 

 fixBoxShadowBlur($('*')); function fixBoxShadowBlur(jQueryObject){ if($.browser.msie && $.browser.version.substr(0, 1) == '9'){ jQueryObject.each(function(){ boxShadow = $(this).css('boxShadow'); if(boxShadow != 'none'){ var bsArr = boxShadow.split(' '); bsBlur = parseInt(bsArr[2]) || 0; bsBlurMeasureType = bsArr[2].substr(("" + bsBlur).length); bsArr[2] = (bsBlur * 2) + bsBlurMeasureType; $(this).css('boxShadow', bsArr.join(' ')); } }); }

}

您可以使用阴影来实现渐变，并将使用border-radius在Internet Explorer 9上工作

像这样的东西： 

 box-shadow: inset 0px 0px 26px 5px gainsboro;

不知道这是一个closures或有效的解决方法，但…

我发现提供的边界半径大于边界宽度，我没有遇到这个问题。 当他们是相同的我得到方angular。

使用指南针和sass你可以很容易地实现这样的： 

 @import "compass"; #border-radius { @include border-radius('RADIUS'px); } #gradiant{ $experimental-support-for-svg: true; @include background-image(linear-gradient('COLOR') %,('COLOR') %,...; }

指南针将为您生成一个SVG图像。

像这样： 

 #gradiant { background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9InRvIiB5MT0iYm90dG9tIiB4Mj0idG8iIHkyPSJ0b3AiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiMwODJhMmUiLz48c3RvcCBvZmZzZXQ9IjM1JSIgc3RvcC1jb2xvcj0icmdiYSg4LCA0MiwgNDYsIDAuNzYpIi8+PHN0b3Agb2Zmc2V0PSI0MyUiIHN0b3AtY29sb3I9InJnYmEoNywgNDMsIDQ3LCAwLjcxKSIvPjxzdG9wIG9mZnNldD0iNTglIiBzdG9wLWNvbG9yPSJyZ2JhKDQsIDQ0LCA1MCwgMC41OCkiLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwNDJjMzIiLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSJ1cmwoI2dyYWQpIiAvPjwvc3ZnPiA='); background-size: 100%; background-image: -webkit-gradient(linear, to bottom, to top, color-stop(0%, #082a2e), color-stop(35%, rgba(8, 42, 46, 0.76)), color-stop(43%, rgba(7, 43, 47, 0.71)), color-stop(58%, rgba(4, 44, 50, 0.58)), color-stop(100%, #042c32)); background-image: -webkit-linear-gradient(to bottom, #082a2e 0%, rgba(8, 42, 46, 0.76) 35%, rgba(7, 43, 47, 0.71) 43%, rgba(4, 44, 50, 0.58) 58%, #042c32 100%); background-image: -moz-linear-gradient(to bottom, #082a2e 0%, rgba(8, 42, 46, 0.76) 35%, rgba(7, 43, 47, 0.71) 43%, rgba(4, 44, 50, 0.58) 58%, #042c32 100%); background-image: -o-linear-gradient(to bottom, #082a2e 0%, rgba(8, 42, 46, 0.76) 35%, rgba(7, 43, 47, 0.71) 43%, rgba(4, 44, 50, 0.58) 58%, #042c32 100%); background-image: linear-gradient(to bottom, #082a2e 0%, rgba(8, 42, 46, 0.76) 35%, rgba(7, 43, 47, 0.71) 43%, rgba(4, 44, 50, 0.58) 58%, #042c32 100%);

} 

 /* line 28, ../sass/boxshadow.scss */ #border-radius { -moz-border-radius-topright: 8px; -webkit-border-top-right-radius: 8px; border-top-right-radius: 8px; -moz-border-radius-bottomright: 8px; -webkit-border-bottom-right-radius: 8px; border-bottom-right-radius: 8px;

}

为我工作… 

 <!--[if gte IE 9]> <style type="text/css"> .gradient{ filter: ; } </style>

CSS 

 border-radius: 10px; background: #00a8db; /* Old browsers */ background: -moz-linear-gradient(top, #00a8db 0%, #116c8c 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#00a8db), color- stop(100%,#116c8c)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #00a8db 0%,#116c8c 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #00a8db 0%,#116c8c 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #00a8db 0%,#116c8c 100%); /* IE10+ */ background: linear-gradient(to bottom, #00a8db 0%,#116c8c 100%); /* W3C */ -webkit-box-shadow: 1px 5px 2px #999; -moz-box-shadow: 1px 1px 5px #999; box-shadow: 1px 1px 5px #999; color: #fff; filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00a8db', endColorstr='#116c8c',GradientType=0 ); /* IE6-8 */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwYThkYiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMxMTZjOGMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); /* W3C Markup, IE10 Release Preview */ background-image: linear-gradient(to top, #116C8C 0%, #00A5D7 100%);
Interesting Posts