テーブルの作成

テーブルの作成方法等を簡単に紹介する

① テーブルを作成する。
メニューから  テーブル -> テーブルの挿入
メニューのテーブルアイコンでもOK
(Alt+A,Alt+T でもOK)


行数、列数を指定する。OKクリック。
このままOKでテーブルが見えない(透明)場合は、視覚補助を表示させると点線で表示される。
外枠に色を付ける場合は、下記のようにする。

  
   
   

セルの境界線に色を付ける場合は、全ての列を選択して、右クリックからセルプロパティを選ぶ。
罫線サイズと、色を指定する。OKクリック。

   
   


【視覚補助を表示させる方法】
テーブルが透明で見えない場合は、メニューの 表示 -> 資格補助 -> 表示 でテーブルは罫線が点線表示される。 この点線は、ブラウザでは表示されない。
Cntl+/  でも 資格補助表示の on/off が切り替わる。

【セルの罫線に色を使した場合の消し方】
全ての列を選択してセルのプロパティでサイズを0にすればよい。

②その他
・行の挿入、削除
・列の挿入。削除
他にも色々変更可能。

操作はマウスで対象(テーブル、行、列、セル)かを選び(色が変わる)、メニュー及び右クリックで操作する。意図しない動きなら、Cntl+Z で元に戻す。

 

③ 部位の選択方法
マウスカーソルをテーブルの各部に移動するとアイコンが変化する。アイコンに着目すると、選択時に有効。
アイコンが出た位置で左クリックすることで、それが選択(色が変る)される。 

テーブル全体を選択 
   
行を選択。ドラッグで複数行選択
列を選択。ドラッグで複数列選択。
   
行と行の境界(罫線)を選択。ドラッグで移動
列と列の境界(罫線)を選択。ドラッグで移動。
   

 

【メニューから選択する方法】

セルをクリック(選択する位置のセル)して
メニューから  テーブル  -> 選択  ->  テーブル、行、列、セル を選択できる

・セル選択  カーソルがあるセルが選択される。
・行選択   カーソルがある行(色が変わる)が選択される。
・列選択   カーソルがある列(色が変わる)が選択される。
・テーブル  カーソルがあるテーブル(色が変わる)が選択される。

【クイックタグセレクターを使う】 マウス操作が苦手ならお勧め
・適当なセルをクリックし、編集画面の上部にあるクイックタグセレクターにある<table>を選択する。
・行選択<tr>、セル選択もできる。 列は出来ない。
・クイックタグセレクターが表示されない場合は、メニューの 表示 ->  クイックタグセレクター にチェックを入れる。
・選択されるとその選択範囲の色が変る。

 

・表以外でも使用できる。 そのブロックにカーソルを移動し、クイックタグセレクターで選択。色が変る。

 

まとめ

・テーブルの罫線(色、線の太さ)は、テーブルの外枠とセル、2箇所で設定している。

・テーブルが沢山あり、罫線を作業後に透明にする場合は、テーブルをコピー(クローン)すれば
後から一括で変更できるので、効率が良い。

・テーブルの色を一括で変更(スケルトン等)するには、スタイルを一か所変更すれば良いように作ることがポイント。

・スタイルの変更はコードのスタイル部分を直接変更する方法と、パネルでCSSのプロパティを変更する方法がある。 慣れれば、コード変更が速い! 

・テーブルはスケルトンでも視覚補助で薄く見えるが、線に色を付けておいて後から一括で直すのがスマートな方法と思う。 目が疲れずに、結果的に速い?