角を丸くする　

PhotoShop / PhotoShop-E

画像の場合　（例：　下左図）

PhotoShop / PhotoShop-E で「全てを選択」 → 「選択範囲を変更」 → 「滑らかに」 → Rを指定
画像の片方のみが角の場合も 適用できる

テキスト文を入れた枠の場合　（例：　下右表枠）

( InternetExplorer９ 以降で、角を丸くする「radius」が対応。　スマホも対応。　)

CSSを使ったこの枠は、ニュースやお知らせを記入して簡単に更新できる。
画像では更新のたびに画像加工が必要だが、 この方法では table内文章のように簡単にテキスト文を記入できる。
table との違いは、この例のように、枠の角を丸くしたり、 点線、破線、２重線や、凸、凹み線にできる他、 枠周囲のスペース
を margin として指定できる。
このボックス角の丸め = radius ： 15px

作り方：
・従来のtableを置き、<td> </td> の間に
・このページのソースの<div>〜</div>をcopy して設定値を替える。
・枠の全体幅は、表幅とmargin 値によって決まる。margin 値は表のセル境界からの値である。

	この表示のように、CSSを使った枠の処理は便利だが、角を丸くする「radius」は InternetExplorer９ 以降が必要。 Google Chrome / FireFox はこの表示のように対応している。 InternetExplorer ９ は対応しているがサーバードメインによっては対応しない。 Yahooドメイン/FC2/Cyberhome/SpeedNet はOK
｜　CSS　　　｜　ホームページ作成体験　　｜