デザインガイド
開智未来中学・高等学校 > デザインガイド
見出しは [内容] の [HTMLタグ] から [H1〜H6] を選ぶだけで、以下の様なデザインが反映されます。
H1 見出しテキスト
H2 見出しテキスト
H3 見出しテキスト
H4 見出しテキスト
H5 見出しテキスト
H6 見出しテキスト
さらに、H3以下の見出しは、[高度な設定] のCSSクラスに [style1] [style2] [style3] [style4]を設定いただくと見出しのデザインを変更することができます。例:H3の場合
H3 見出しテキスト CSSクラス style1
H3 見出しテキスト CSSクラス style2
H3 見出しテキスト CSSクラス style3
H3 見出しテキスト CSSクラス style4
ボタンとカラーコード
ボタンの色設定とHP内での使用色については以下のコードを参考に設定してください。
ボタンの色を変える場合は [スタイル] から背景色を選びます。
文字の色を変更する場合は、2通りの方法があり、部分的に変更する場合は、画面左に表示されているテキストエディター内のテキスト色変更ボタンから、ボックス内(要素内)全体の色味を変える場合は [スタイル] > [文字色]で色の指定をします。
▼配置している要素の間隔を開けたいときには [スペーサー] を使うと便利です。
実はこの文章の上下にスペーサーが入ってます
▼区切り線はこんな風に入ります
アコーディオンメニュー
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
タブ
タブ #1
タブ #2
タブ #1
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
タブ #2
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.