「CSS3 PIE」で、IE 6〜8 にも CSS3の機能を使えるようにしよう
CSSはこちら
div.radius {
text-align: center;
height: 100px;
width: 300px;
border: 1px solid #999;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
background: #FFC;
behavior: url(/samples/samplepie-set/PIE.htc);
position: relative;
}
CSSはこちら
div.shadow {
background: #FFC;
text-align: center;
height: 100px;
width: 300px;
-webkit-box-shadow: 15px 15px 10px #999;
-moz-box-shadow: 15px 15px 10px #999;
box-shadow: 15px 15px 10px #999;
behavior: url(/samples/samplepie-set/PIE.htc);
position: relative;
}
CSSはこちら
div.gradient {
text-align: center;
height: 100px;
width: 300px;
background: -moz-linear-gradient(top, #FF9, #9C0);
background: -webkit-gradient(linear, left top, left bottom, from(#FF9), to(#9C0));
background: -o-linear-gradient(top, #FF9, #9C0);
background: linear-gradient(top, #FF9, #9C0);
-pie-background: linear-gradient(top, #FF9, #9C0);
behavior: url(/samples/samplepie-set/PIE.htc);
position: relative;
}