児童会合言葉　　やる気・げん気・やさしい心根

文書の装飾を　class　を使って指定します。

<p>福山市立大谷台小学校</p>

この文書に装飾を施します。

<img src="images/sample1.jpg" class="alignright frame">

class="alignright"は，写真を右寄せし，文書を写真の左側に流し込みます。
class="frame"は，写真のまわりに枠線表示します。
class="alignright frame"とすると，同時にその両方を適用します。

<img src="images/sample1.jpg" class="alignleft frame">とした場合は，写真を左寄せし，写真のまわりに枠線表示し，文書を写真の右側に流し込みます。

絵柄のフォントを簡単に組み込めます。

ボタンを簡単に設置できる仕組みが組み込まれています。

メニューボタン

• メニュー１
• メニュー２
• メニュー３

<ul class="button-group">

<li><a href="menu1.html#breadcrumb" class="menu_button select">メニュー１</a></li>

<li><a href="menu2.html#breadcrumb" class="menu_button">メニュー２</a></li>

<li><a href="menu3.html#breadcrumb" class="menu_button">メニュー３</a></li>

</ul>

横1列ボタン（class="single"）

<div class="single">

<a class="button red" href="page1.html#breadcrumb">ページボタン１</a>

<a class="button blue" href="page2.html#breadcrumb>ページボタン２</a>

<a class="button green" href="page3.html#breadcrumb>ページボタン３</a>

</div>

横2列ボタン（class="double"）

横3列ボタン（class="triple"）

<a class="button" href="#" target="_blank" style="width:120px;"><i class="fa fa-file-pdf-o red"></i>　FDFはこちら</a>