背景画像を使用せずに、テーブルの角を丸くする(インライン)ことは可能でしょうか?
ライブデモ]
table{
background: red;
border-radius:10px;
-moz-border-radius:10px;
-webkit-border-radius:10px;
}
sigh とインラインで...
<table style="background: red;border-radius:10px;-moz-border-radius:10px;-webkit-border-radius:10px;">
セルをdivに変換する意味がよくわからないのですが。
この例では、すべてのコーナーに5pxの丸みを帯びたボーダーを作成します。
#example{
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
もし、異なる角の丸みを帯びたボーダーを作成したい場合や、特定の角の丸みを帯びたボーダーを作成したい場合は、以下のコードを変更してください。
#example1{
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 10px;
-webkit-border-bottom-right-radius: 20px;
-webkit-border-bottom-left-radius: 15px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 10px;
-moz-border-radius-bottomright: 20px;
-moz-border-radius-bottomleft: 15px;
border-top-left-radius: 5px;
border-top-right-radius: 10px;
border-bottom-right-radius: 20px;
border-bottom-left-radius: 15px;
}
http://border-radius.com/ を参照してください。