TOP　＞　Users　＞　ORCA教育用教材　＞ 　発展1　申込フォームを作成する　＞　発展1-3.CSSの設定

 発展1　申込フォームを作成する

 発展1-3.CSSの設定

CSSを使い、作成した <table> にスタイルを適用して体裁を整えます。

1. バンクの [HTML Header] に、HTML装飾のCSSを記述します。
   

   



2. [バンク文章] で、HTMLの各タグにCSSのclassを設定します。
   
   

   タグ	class
   <table>	waku_01
   <th>	waku_01
   <td>	waku_01
   <td>内の<table>	waku_02

   



3. CSSが適用されました。
   

   



4. スマホでの表示などブラウザの横幅を狭めたとき、自動的に項目名、入力欄を縦に並べて表示するスタイルを設定します。
   

   



5. 「スマホ表示」は項目名、入力欄を縦に並べて表示しています。
   

   



6. その他の装飾を行い、回答者がより入力しやすい申込フォームを目指します。
   

■項目名に任意、必須のラベルを表示する

■入力例や注釈を表示する

申込フォームの体裁が整いました。