夜月星礼
12697文字
Public
【コピペOK】いい感じのページをサクッと作ろう【サンプル】
詳細な解説はnoteで行っています。
デザインサンプル／見出し
Privatter+標準のタグ以外のタグ詳細はnoteにて公開しています。◇シンプルな見出し
Privatter+標準タグ見出し／h3
1-1：divタグ見出し／h3に似せたもの
1-2：太字にしない
1-3：文字色#FF0000
1-4：太字にしない、文字色#FF0000
1-5：中央寄せ
1-6：右寄せ
◇罫線系
線の種類はこちら。
| 名称 | 指定値 |
|---|---|
| 実線 | solid |
| 破線 | dashed |
| 点線 | dotted |
| 二重線 | double |
調査したところ、Privatter+では波線（wavy）には対応していないようです（1px指定では何も出ず、5px指定で点線が出る）
・下線
2-1：実線下線1px
2-2：実線下線5px
2-3：下線5px色#FF0000
2-4：文字色#FF0000、下線5px色指定なし
2-5：文字色#A9A9A9、下線5px色#FF0000
3-1：破線下線1px
3-2：破線下線5px
4-1：点線下線1px
4-2：点線下線5px
5-1：二重線下線5px
5-2：二重線下線10px
※二重線は太めのpxにしないと二重線になりません。細いと実線のように表示されます。
※3～5までの色変更などは2と同様なので省略。
・左だけ
6-1：左線1px（色指定なし）
6-2：左線10px（色指定なし）
・左と下の組み合わせ
6-3：左線10px（色指定なし）
◇背景色系
・単色背景
7-1：背景色＃A9A9A9
7-2：左に線+背景色＃A9A9A9
7-3：左と下に線+背景色＃A9A9A9
7-4囲み実線+背景色＃A9A9A9
7-5囲み実線2+背景色＃A9A9A9
・グラデーション背景
8-1：左上から斜めグラデーション+不透明度80%白背景+黒文字
8-2：右下から斜めグラデーション+不透明度80%白背景+黒文字
8-3：上からグラデーション+不透明度80%白背景+黒文字
8-4：下からグラデーション+不透明度80%白背景+黒文字
・柄背景
9-1：斜めストライプ柄+不透明度80%白背景+黒文字
9-2：斜めストライプ柄2+不透明度80%白背景+黒文字
9-3：横ストライプ柄+不透明度80%白背景+黒文字
9-4：縦ストライプ柄+不透明度80%白背景+黒文字
9-5：チェック柄+不透明度80%白背景+黒文字
9-6：斜めチェック柄+不透明度80%白背景+黒文字
9-7：ドット柄+不透明度80%白背景+黒文字
9-8：大きめドット柄+不透明度80%白背景+黒文字
※背景色を指定するときは文字色がデザイン設定に左右されることもあるため、文字色指定もしておくか、ライト・ダークどちらのモードでも遜色ない背景色にするのがベスト。
※背景と罫線がずれた装飾タグもネット検索するとよく出てくるのですが、Privatter+では「box-shadow」が利用できないのでうまく反映されないと思います。可愛いのに残念。
▶TOPに戻る
▶noteに戻る
