<!-- HTML -->
<div style='background-color:#000;color:#fff; padding:10px;'>
<div class='cgte_b gradient-dark'><span></span>Gradient Gray</div>
<div class='cgte_b gradient-shine'><span></span>Gradient Shine</div>
<div class='cgte_b gradient-dark-stripe'><span></span>Vertical Stripe</div>
<div class='cgte_b gradient-dark-stripe-hz'><span></span>Horizontal Stripe</div>
<div class='cgte_b pattern'><span></span>Pattern Zebra</div>
</div>
<!-- CSS -->
<style type='text/css'>
div.cgte_b {
padding:15px 0;
font-weight:bold;
font-size:40px;
position:relative;
color: #b7b7b7;
overflow:hidden;
line-height:1;
}
div.cgte_b span {
position: absolute;
display: block;
width: 100%;
height:40px;
}
div.gradient-dark span {
height:40px;
bottom: -0.1em;
background:transparent url(/content/img/css/css_gradient/gradient-dark.png) repeat-x 0 0;
}
* html div.gradient-dark span {
background: none;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/content/img/css/css_gradient/gradient-dark.png', sizingMethod='scale');
}
div.gradient-shine {
color: #fff;
}
div.gradient-shine span {
height:80px;
background:transparent url(/content/img/css/css_gradient/gradient-shine.png) repeat-x 0 0;
}
* html div.gradient-shine span {
background: none;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='content/img/css/css_gradient/gradient-shine.png', sizingMethod='scale');
}
div.gradient-dark-stripe span {
background:transparent url(/content/img/css/css_gradient/gradient-dark-stripe.png) repeat-x 0 0;
bottom: -0.1em;
}
* html div.gradient-dark-stripe span {
background: none;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='content/img/css/css_gradient/gradient-dark-stripe.png', sizingMethod='scale');
}
div.gradient-dark-stripe-hz span {
background:transparent url(/content/img/css/css_gradient/gradient-dark-stripe-hz.png) repeat-x 0 0;
bottom: -0.1em;
}
* html div.gradient-dark-stripe-hz span {
background: none;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='content/img/css/css_gradient/gradient-dark-stripe-hz.png', sizingMethod='scale');
}
div.pattern span {
background:transparent url(/content/img/css/css_gradient/pattern-zebra.png) repeat-x 0 0;
}
* html div.pattern span {
background: none;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='content/img/css/css_gradient/pattern-zebra.png', sizingMethod='scale');
}
</style>