初期設定マニュアル

対象セレクタ

FunMakerにおいて、左側の項目のテキストを指定するセレクタは、『.content-body #about th』になります。右側の項目のテキストを指定するセレクタは『.content-body #about td』です。
ラインの変更もこのセレクタで変更可能ですが、一番上にラインを引く場合は『.content-body #about table』を使用してください。（アンダーラインを各項目に入れている場合にトップラインを入れると、上下のアンダーラインとトップラインが重なってデザインが若干乱れるため。）

.content-body #about th {
	CSSプロパティ: 値;
}
.content-body #about td {
	CSSプロパティ: 値;
}
.content-body #about table {
	CSSプロパティ: 値;
}

CSSプロパティ一覧

管理者情報の項目のテキストには、通常通りテキスト要素に指定できる全てのCSSプロパティが利用できます。
以下に、利用できる代表的なCSSプロパティとその意味、使用例を紹介します。

background-color

意 味：背景色の指定。値は、RGB、RGBAでの指定が可能。

使用例：『background-color: #FFA001;』（Webセーフカラー一覧）

text-align

意 味：行揃えを指定。auto［自動］/left［左］/center［中央］/right［右］/justify［両端揃え］

使用例：『text-align: center;』『text-align: right;』

margin

意 味：要素を囲むボックス外側の余白を指定。順番は上、右、下、左。

使用例：『margin: 30px 20px 40px 30px;』（上30px、右20px、下40px、左30pxの余白）

padding

意 味：要素を囲むボックス内側の余白を指定。順番は上、右、下、左。

使用例：『padding: 30px 20px 40px 30px;』（上30px、右20px、下40px、左30pxの余白）

background

意 味：背景の色、画像、画像の繰り返し、画像の固定、画像の位置を一括して指定。

使用例：『background: #FFA001 url(https://funmaker.jp/service/icon/free/symbol/plane_001/cyanL.png) no-repeat top right fixed;』

border

意 味：要素を囲むボックスの枠線を指定。下線だけを指定する時はborder-bottom、以下同様に左border-left、上border-top、右border-right。

使用例：『border: solid 1px #FFA001;』『border-bottom: solid 1px #FFA001;』

使用例

以下、管理者情報の項目に対するCSSを利用したデザインの変更例を紹介します。

文字色の変更とアイコンの追加

.content-body #about th {
	color: #0099FF; /* 文字の色　#0099FF */
	background: url(https://funmaker.jp/service/icon/free/symbol/plane_001/cyanS.png) no-repeat 0 0; /* アイコンの指定 */
	background-position: left center; /* アイコンの位置　左中央 */
	padding: 0 0 0 20px; /* 内側の余白　上0　右0　下0　左　20px */
}

2行目で文字の色をブルーにし、3行目でアイコンを追加しています。4行目でアイコンの位置を調節し、5行目でテキストの位置を調節しています。
アイコンは、FunMakerが用意している、無料アイコンを利用し、背景色、画像固定についてはデフォルトのままで良いので指定を省略しています。全て指定を表記した場合は
background: rgb(0, 0, 0) url(https://funmaker.jp/service/icon/free/symbol/plane_001/orangeL.png) no-repeat scroll 0 0;
となります。

borderを利用したデザイン

.content-body #about th, .content-body #about td {
	border-bottom: 1px dotted #0099FF; /* アンダーライン　太さ1px　点線　色は#0099FF */
}
.content-body #about table {
	border-top: 1px dotted #0099FF; /* トップライン　太さ1px　点線　色は#0099FF */
}

2行目で項目のアンダーラインを青色の点線にしています。5行目で上のラインを同じくブルーの点線に変更しています。
borderは今使用した実線［solid］の他にも、double［二重線］、破線［dashed］、dotted［点線］、groove［へこんで見える線］、ridge［盛り上がって見える線］、inset［線の内側がへこんで見える線］、outset［線の内側が盛り上がって見える線］等に変更することが可能です。