FunMaker[ファンメイカー]で レイアウトの自由調整ページ を用いて枠線を変更するためのマニュアルページです。
枠線はサイトデザイン機能やレイアウトの自由調整で設定し、これらは角を丸く装飾することができます。
枠線の角を丸くすることで枠線の内側の要素が画像に対して設定することで表示される画像の角を丸くしたり、角のカーブの範囲を広げることで楕円や円形の画像を表示させることもできます。

枠線の角を指定する際の注意点

画像の角を丸くしたり円形に表示される機能は、画像カセットや記事一覧カセットに設けられていますので、画像を丸く表示したい際にはそれぞれ 画像カセット 記事一覧カセット を参照しカセットの機能で変更してください。

枠線の角の指定方法

枠線の角を指定する際のCSSは「border-radius:(枠線の角を指定する値)」と記述します。 枠線の角の指定方法はいくつかありますが、当マニュアルでは範囲の大きさに対する割合で角を丸くする範囲を指定できる%での設定方法と設定した数値がそのまま反映するpxでの設定方法を解説しています。
参考:枠線の角の指定方法は%やpx以外にemなどがあり、emと%は指定した値と親となる要素で指定されている値の掛け合わせで大きさが反映します。

記述例

サイト全体の基本となる文字サイズを指定する際のコードです。
img {
    border-radius: 20%;/*サイト内のすべての画像で角丸に設定*/
}
記述例のコードを設定した場合の表示は下記の通りです。

枠線の角を指定する値

%とpxによる見え方の違い、また各数値での見え方の違いは下記の通りです。
0.1
0.2
0.3
0.4
0.5
10px
20px
30px
40px
50px

ファンメイカーのデフォルトの設定

枠線の角の解説は以上となります。
CSSでの設定はコードの記述をご自身の判断で行えるユーザー様向けの機能です。 ご留意ご利用にあたってはCSSマニュアルの使い方でご案内している注意事項をご理解の上で、ご自身の判断でお使いください。 コードに関して個別のご案内が必要な場合は、お見積りの上、当社で設定を代行することになりますので、ご入用でしたらお問い合わせフォームよりご連絡ください。