PHP & JavaScript Room :: 設置サンプル

実行結果

Gradient Glossy
Gradient White
Gradient Gray

ソース

<!-- HTML -->
<div class='cgte gradient-glossy'><span></span>Gradient Glossy</div>
<div class='cgte gradient-white'><span></span>Gradient White</div>
<div class='cgte gradient-grey'><span></span>Gradient Gray</div>

<!-- CSS -->
<style type='text/css'>
div.cgte {
    font-family:verdana,sans-serif;
    line-height:1;
    font-weight:bold;
    font-size:30px;
    position:relative;
    color:#464646;
    padding:15px 0;
}
div.cgte span {
    position:absolute;
    display:block;
    width:100%;
}
/* Gradient Glossy */
div.gradient-glossy span {
    height:30px;
    background:transparent url(/content/img/css/css_gradient/gradient-glossy.png) repeat-x 0 0;
}
* html div.gradient-glossy span {
    background: none;
      filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/content/img/css/css_gradient/gradient-glossy.png', sizingMethod='scale');
}
/* Gradien White */
div.gradient-white span {
    height:30px;
    background:transparent url(/content/img/css/css_gradient/gradient-white.png) repeat-x 0 0;
}
* html div.gradient-white span {
    background: none;
      filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/content/img/css/css_gradient/gradient-white.png', sizingMethod='scale');
}
/* Gradient Gray */
div.gradient-grey span {
    height:30px;
    background:transparent url(/content/img/css/css_gradient/gradient-grey.png) repeat-x 0 0;
}
* html div.gradient-grey span {
    background: none;
      filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/content/img/css/css_gradient/gradient-grey.png', sizingMethod='scale');
}
</style>

polarized women