スタイルガイド(タイトルに入力するとh1として表示されます)

中見出し:h2タグにあたる見出しです

小見出し:h3タグにあたる見出しです

本文は、pタグで囲っていただくと表示されます。
固定ページ内のルールとして、本文はフォントサイズ16px、行間32pxで表示されるようになっています。
特別注釈を記入したいときなど、「c-text--12」クラスをつけたspan等で囲っていただくと文字を小さくできます。
盛岡市動物公園

画像にキャプションを付けたい場合は、「figure」タグ内に画像と「figcaption」タグで囲ったキャプションを入れていただくと表示されます。キャプションなしの場合はimgタグのみ、または後述の「c-img」クラスと「c-img--3-2」クラスをつけた「div」タグで囲った「img」タグで表示できます。

2カラムの表示について

固定ページ内で使われている2カラムは、こちらの「c-col2-container」を元にしていただくと表示できます。
こちらのページで表示されているように、2カラムにすると、左右のカラムの高さが自動で揃います。

小見出し:開園時間

本文:盛岡市動物公園ではアフリカゾウ、キリン、ライオンなどの大きな動物、ニホンザルやノウサギ、キジやイヌワシなどの日本の動物、姉妹都市のビクトリア市(カナダ)から贈られたカナダカワウソやオオツノヒツジなどなど、約70種類400頭羽の動物たちが、みなさまのおこしをお待ち申し上げております。キリンやアフリカゾウなどへの給餌体験もできますし、週末には催し物がもりだくさん!!広い芝生広場でおべんとうをひろげて、ちょっとしたピクニックも楽しめます。この週末は、ぜひ盛岡市動物公園へおいでください。

テーブル
大人(高校生以上) 500円
大人(高校生以上) 500円
大人(高校生以上) 500円
大人(高校生以上) 500円
大人(高校生以上) 500円
大人(高校生以上) 500円
金額 大人(高校生以上) 500円
金額 大人(高校生以上) 500円
金額 大人(高校生以上) 500円
テーブルのスタイルです。theadタグは、必要な場合のみの記入で大丈夫です。画像と同様に、キャプションを付けたい場合は「table」タグを「figure」タグで囲い、「figcaption」タグでキャプションを付けます。

囲み:盛岡市動物公園ではアフリカゾウ、キリン、ライオンなどの大きな動物、ニホンザルやノウサギ、キジやイヌワシなどの日本の動物、姉妹都市のビクトリア市(カナダ)から贈られたカナダカワウソやオオツノヒツジなどなど、約70種類400頭羽の動物たちが、みなさまのおこしをお待ち申し上げております。キリンやアフリカゾウなどへの給餌体験もできますし、週末には催し物がもりだくさん!!広い芝生広場でおべんとうをひろげて、ちょっとしたピクニックも楽しめます。この週末は、ぜひ盛岡市動物公園へおいでください。

  1. 箇条書きリスト箇条書きリスト箇条書きリスト箇条書きリスト箇条書きリスト箇条書きリスト箇条書きリスト箇条書きリスト箇条書きリスト箇条書きリスト箇条書きリスト箇条書きリスト箇条書きリスト箇条書きリスト箇条書きリスト箇条書きリスト箇条書きリスト箇条書きリスト箇条書きリスト箇条書きリスト箇条書きリスト
  2. 箇条書きリスト
  3. 箇条書きリスト
  4. 箇条書きリスト
  5. 箇条書きリスト

囲み:盛岡市動物公園ではアフリカゾウ、キリン、ライオンなどの大きな動物、ニホンザルやノウサギ、キジやイヌワシなどの日本の動物、姉妹都市のビクトリア市(カナダ)から贈られたカナダカワウソやオオツノヒツジなどなど、約70種類400頭羽の動物たちが、みなさまのおこしをお待ち申し上げております。キリンやアフリカゾウなどへの給餌体験もできますし、週末には催し物がもりだくさん!!広い芝生広場でおべんとうをひろげて、ちょっとしたピクニックも楽しめます。この週末は、ぜひ盛岡市動物公園へおいでください。

囲み:盛岡市動物公園ではアフリカゾウ、キリン、ライオンなどの大きな動物、ニホンザルやノウサギ、キジやイヌワシなどの日本の動物、姉妹都市のビクトリア市(カナダ)から贈られたカナダカワウソやオオツノヒツジなどなど、約70種類400頭羽の動物たちが、みなさまのおこしをお待ち申し上げております。キリンやアフリカゾウなどへの給餌体験もできますし、週末には催し物がもりだくさん!!広い芝生広場でおべんとうをひろげて、ちょっとしたピクニックも楽しめます。この週末は、ぜひ盛岡市動物公園へおいでください。

こちらは白い背景をつけるためのクラスです

白背景なので、一見するとこちらのクラスで囲わなくても良いように見えますが、コンテンツ内全体が白背景の場合、フッター上の余白が入らなくなってしまうので注意が必要です。

こちらはベージュの背景をつけるためのクラスです

本文:盛岡市動物公園ではアフリカゾウ、キリン、ライオンなどの大きな動物、ニホンザルやノウサギ、キジやイヌワシなどの日本の動物、姉妹都市のビクトリア市(カナダ)から贈られたカナダカワウソやオオツノヒツジなどなど、約70種類400頭羽の動物たちが、みなさまのおこしをお待ち申し上げております。キリンやアフリカゾウなどへの給餌体験もできますし、週末には催し物がもりだくさん!!広い芝生広場でおべんとうをひろげて、ちょっとしたピクニックも楽しめます。この週末は、ぜひ盛岡市動物公園へおいでください。

こちらは薄めの茶色の背景をつけるためのクラスです

本文:盛岡市動物公園ではアフリカゾウ、キリン、ライオンなどの大きな動物、ニホンザルやノウサギ、キジやイヌワシなどの日本の動物、姉妹都市のビクトリア市(カナダ)から贈られたカナダカワウソやオオツノヒツジなどなど、約70種類400頭羽の動物たちが、みなさまのおこしをお待ち申し上げております。キリンやアフリカゾウなどへの給餌体験もできますし、週末には催し物がもりだくさん!!広い芝生広場でおべんとうをひろげて、ちょっとしたピクニックも楽しめます。この週末は、ぜひ盛岡市動物公園へおいでください。

こちらは茶色の背景をつけるためのクラスです

こちらのクラスをつけると、本来の文字の色、線の色と同じ色が背景色になるので、中に入る文字と線は強制的に白い色になります。

こちらは、指定した画像を3:2にトリミングするための「c-img c-img--3-2」クラスです。
どのカラム内で使用しても、3:2の比率で横幅いっぱいに表示します。
あくまで表示上3:2に見えるようにするクラスなので、コンテンツの表示横幅(1000px以下)に対して大きすぎる画像を使用すると、ページの表示が遅くなることがあります。
また、どの画像もそうですが、コンテンツの表示横幅より小さい画像をコンテンツ幅いっぱいに表示しようとすると画像が引き伸ばされて荒くなり、画像自体の内容がわかりにくくなる場合がありますし、コンテンツの表示横幅より大きい画像を使用すると、縮小されて文字等が判別できなくなる場合があります。

こちらのクラスには画像下部の余白も含まれますので、3:2の画像をキャプション付きで表示したい場合等、余白が不要な際は更に「c-img--no-mb」クラスを足していただくことで、下部余白のない状態で表示できます。