CSSを利用して、丸角の背景を作る方法

質問

タイトルのままなのですが、CSSを使用してボックスの背景を丸角の画像にしたいのですが、どうやればいいのかよくわかりません
どなたかわかる方いらっしゃいましたら教えてください。

回答No.1

うぃず（@Wizard_Zero） · ベストアンサー

Wizard_Zeroと申します。

角の丸い部分は画像で作る方法がベターだと思います。具体的には、テーブルで3x3のマスをつくり、角に角丸の画像、上下左右の４辺に直線の画像をリピートで。

http://www.w-frontier.com/stylesheet/roundrect.html

<DIV>をいくつも重ねれば、スタイルシートだけで角を丸くすることもできるようです。

http://www.ad.il24.net/~ura/css/kado_maru.htm

写真などの場合は、画像編集ソフトであらかじめ角を丸くすればよいです。

お礼

返事が大変遅くなりまして、申し訳ございません
ありがとうございました
何とか解決しました

回答No.2

UKY

ボックスの大きさ (ピクセル数) が固定されているなら可能ですが、ボックスの大きさが可変なら今の CSS では無理です。
今の CSS にはボックスの四つ角の背景をそれぞれ変えるというような高度な機能はありませんので。

少しずつずらしたボックスをたくさん重ねて……という人もいるようですが、たとえ CSS を使っていても見栄えのために HTML を書かなきゃいけないという点ではテーブルを何重にも重ねるやり方と同じですね。

お礼

返事が大変遅くなりまして、申し訳ございません
ありがとうございました
何とか解決しました