Visual Web Developer での HTML テーブル編集の概要
更新 : 2007 年 11 月
Web ページで HTML テーブルを使用して、ページのレイアウトを定義したり、列形式で内容を表示したりできます。Visual Studio では、デザイン ビューで視覚的に、またはソース ビューでマークアップとして HTML テーブルを編集できます。
デザイン ビューでのテーブル編集
デザイン ビューでは、Web ページ デザイナのテーブル エディタで、HTML テーブルを視覚的に編集できます。ツールボックスから、またはテーブル プロパティとセル プロパティの設定オプションを提供するダイアログ ボックスを使用して、ページにテーブルを追加できます。テーブルは、ブラウザ上での表示と同じようにデザイナ上に表示されます。既定では、編集しやすいように、テーブルの周りに境界線が表示されます。これは、テーブルで境界線を表示するように設定されていない場合でも同様です。
.gif "メモ") メモ : |
|---|
Web ページ デザイナ内のすべての要素の場合と同様、テーブル エディタでは XHTML 互換マークアップが作成されます。詳細については、「Visual Web Developer での XHTML」を参照してください。 |
テーブル エディタでは、行、列、または個々のセルを選択して、それぞれにプロパティを設定できます。テーブル エディタを使用して、列、行、またはセルのサイズを変更することもできます。
| メモ : |
|---|
テーブル エディタでは HTML テーブル (table 要素とその子要素) を編集できますが、ASP.NET Table コントロール (asp:table 要素) は編集できません。ASP.NET Table コントロールは、通常、プログラムから表形式でデータを表示するのに使用され、ページのレイアウトには使用されません。 |
テーブル レイアウト テンプレート
HTML テーブルは、通常、ページ内の要素のレイアウトを定義するために使用されるので、テーブル エディタには定義済みのレイアウト テンプレートのセットが用意されています。テーブルを作成するとき、共通のテーブル レイアウトを選択できます。次のような定義のテーブルがあります。
ヘッダーのセルが 1 つと主要内容のセルが 1 つのテーブル。
主要内容のセルが 1 つと補足内容のセルが 1 つのテーブル。
ヘッダーのセルが 1 つ、フッターのセルが 1 つ、および主要内容のセルが 1 つのテーブル。
| メモ : |
|---|
テンプレートに基づいたテーブルをはじめて作成すると、テーブルに内容が含まれていないので、レンダリング結果が期待どおりにならない場合があります。内容を追加して、テーブル レイアウトをテストしてください。 |
レイアウト テンプレートを使用してテーブルを作成した後、特定の要求に応じて、そのテーブルをカスタマイズできます。
ソース ビューでのテーブル編集
他の HTML 要素を編集する場合と同じように、ソース ビューで HTML テーブルを編集できます。たとえば、他の要素と同じように、テーブル要素に対しても IntelliSense と検証がサポートされています。次のエディタ機能は、ソース ビューでテーブルを操作する際に特に便利な機能です。
HTML エディタのタグ ナビゲータ。現在選択されている要素と、そのページのタグ階層内におけるその要素の位置が示されます。詳細については、「Visual Web Developer の HTML エディタでのタグ ナビゲーション」を参照してください。
タグのアウトライン。テーブル全体など、マークアップのブロックを折りたたむことができます。詳細については、「方法 : Visual Web Developer で HTML 要素の折りたたみや展開を行う」を参照してください。
参照
処理手順
方法 : Visual Web Developer で HTML テーブル要素の追加や削除を行う