CSS3で角丸、便利なんですけど、IEは9でも無視ですから、使えません。
なので、こちらを使って丸くします。
CurvyCorners
http://www.curvycorners.net/
使い方は、ダウンロードしてきたcurvycorners.jsを読み込んで、下記のように<head>に書きます。
読み込み
<script type="text/JavaScript" src="curvycorners.js"></script>
設定
<script type="text/JavaScript">
addEvent(window, 'load', initCorners);
function initCorners() {
var settings = {
tl: { radius: 20 },
tr: { radius: 20 },
bl: { radius: 20 },
br: { radius: 20 },
antiAlias: true
}
curvyCorners(settings, "#wrapper");
}
</script>
ここで、settingsに保存されているtl, tr, bl, brは、top, bottom, left, rightです。
IE6でも丸くなります。
複数の対象に対して指定する方法などは同梱の解説ファイルを読んでみてください。
コメント