css3 と http5 で使用できるようになる角丸の表現。
いくつかのブラウザではサポートされている。
テーマ FotoFolio の css にも Firefox用 のcssがあったが、下記のように他のブラウザでも表示できるように2行を追加した。
これで Google Chrome 、Safari はOKである(IE 8、Opera は×)。
使っている箇所はコメント記入欄の枠一箇所のみ。
div { border-radius: 10px; /* CSS3草案 */ -webkit-border-radius: 10px; /* Safari,Google Chrome用 */ -moz-border-radius: 10px; /* Firefox用 */ } |
div { border-radius: 10px; /* CSS3草案 */ -webkit-border-radius: 10px; /* Safari,Google Chrome用 */ -moz-border-radius: 10px; /* Firefox用 */ }
※角丸表示をブラウザに依存しない java スクリプトが人気のようだ。
ここでは使用しないことにしたが、興味があれば以下でどうぞ。
border-radius.js
KHTML用の角丸指定を追加した。
-khtml-border-radius: 10px;
khtmlとは、linux KDE プロジェクトが開発したHTMLレンダリングエンジン。
これで Konqueror (というブラウザ)でも角丸が表現される。