初心者にもやさしい 簡単HTML作成:ホームページのタグ作成ツール

HTMLテーブルをスタイルシートで

 TABLEタグを使うと、表形式のレイアウトを簡単に作成することができますが、テーブルタグだけだとデザインのシンプルな一覧となってしまいます。

 そこで、スタイルシートを利用した枠線ありのHTMLテーブルタグ作成ツールの紹介です。枠線の色や文字の色、背景色と行・列数の指定で、デザインされた一覧表が簡単に自動作成されるジェネレーターです。

 まずは、「プレビュー」ボタンを押して、tableの表示イメージを確認してみましょう。

表イメージ

テーブルタグを作成してみよう

 HTMLタグを作成すると、クリップボードへ自動でコピーされます。下のテキストボックスからも選択できます。

 手順は次の通りです。

  1. 列数・行数」で表の列と行数を指定する。
  2. 見出し行有無」で見出しが必要な場合は、見出しを指定する。
  3. 表の罫線」で枠線の色・幅を指定する。
  4. 通常行」にて、文字色と背景色を指定する。

 これでテーブルタグの完成です。早速やってみましょう。

列数・行数
列数:
行数(見出し行を除く):
見出し行有無:  
表の罫線
線の太さ 
表の幅
見出し行
背景色
文字色
通常行
背景色
文字色
著作権表示  
  
作成されたテキスト

テーブルタグを簡単作成ツールでは

 この、テーブルHTMLタグ作成ツールでは、次のHTMLタグを使用しています。

  • ブロック要素 <div>〜</div>
  • テーブル(表) <table>〜</table>

 カスケーディングスタイルシート(CSS)を使っています。

 TABLEタグを使うと、表のレイアウトが簡単にできます。四角の枠線を使い、行と列をうまく組み合わせてデータを綺麗に並べてみましょう。

 本ツールでは、JavaScript を使用しています。したがって、JavaScriptが使用できない設定になっているブラウザでは、使用することが出来ません。
 ブラウザのJavaScriptを実行可能に設定して、ご利用ください。

 無料ツールとなっております。リンクもフリーです。テーブルデザインにご利用ください。

 見出し行はセンター位置、通常行は左寄せ位置になっています。各セル内の位置を変更したい場合は、HTML表 テンプレートをご利用ください。

サイトマップ