河川基金-HTML＆CSSサンプル

見出し1

見出し2

見出し3

見出し4

見出し5

見出し6

テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト

テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト

日時+アイコン

2021/00/00

2021/00/00

2021/00/00

2021/00/00

2021/00/00

2021/00/00

2021/00/00

リスト：lineList

• リストサンプル
• リストサンプル
  • リストサンプル
  • リストサンプル

リスト：squareList

• リストサンプル
• リストサンプル
  • リストサンプル
  • リストサンプル

リスト：thumbnailList

• 本文テキストが入ります。本文テキストが入ります。本文テキストが入ります。
• 本文テキストが入ります。本文テキストが入ります。本文テキストが入ります。
• 本文テキストが入ります。本文テキストが入ります。本文テキストが入ります。
• 本文テキストが入ります。本文テキストが入ります。本文テキストが入ります。

「※」マークの注釈

本文文字列の中に注釈を入れる場合は「＜span class=”annotationMark”＞※＜/span＞」と入れると、※マークが小文字の赤文字になります。
また、本文の下に注釈本文を「＜span class=”annotationText”＞ 注釈本文＜/span＞」として入れると、その部分が小文字のグレー文字になります。

このクラスは以下のように使用します。

---

本文のテキスト※1。本文のテキスト本文のテキスト本文のテキスト本文のテキスト本文のテキスト。
本文のテキスト本文のテキスト本文のテキスト本文のテキスト本文のテキスト本文のテキスト※2。
本文のテキスト本文のテキスト本文のテキスト本文のテキスト本文のテキスト。

※１注釈のテキスト。
※2 注釈のテキスト。

回り込み

テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト テキストテキストテキストテキストテキスト

テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト テキストテキストテキストテキストテキスト

リンク

PDFリンク。拡張子が.pdfのファイルをリンクしたときにアイコンが自動的に表示されます。

PDFのアイコンを表示させたくない場合は、class=”noIcon”を付与してください。

• ワードアイコン。拡張子が.docのファイルをリンクしたときに表示されます。
• ワードアイコン。拡張子が.docxのファイルをリンクしたときに表示されます。
• エクセルアイコン。拡張子が.xlsのファイルをリンクしたときに表示されます。
• エクセルアイコン。拡張子が.xlsxのファイルをリンクしたときに表示されます。

リンクボタン：arrowLinkBtn

リンクのサンプル

リンクのサンプルリンクのサンプル

リンク

コンテンツ囲いボックス