勉強しながら同時に収入 !
ホームページビルダーで、
初めてホームページを作る方の為のセミナー

　　　　　　　　　　

TOP PAGE へ戻る

「表レイアウト」でのテーブル枠に上手くカーソルが合わせられない。

この、ご覧のサイトのレイアウトは、外部スタイルシート(CSS)と、表組みのテーブルを使ったレイアウトの両方で作っていますが、初心者の方には、表組みレイアウトで作る方法が一般的です。


その場合、「表テーブル」　と、　「セル　(1行1列のマスを云います)　」　の使いこなしをマスターすることが、上手なレイアウトの近道になります。


ココでは、「表テーブル」の細かい使い方は述べません。


それについては、ビルダーのヘルプをよく参照して学習してください。

その前の段階で、「テーブル枠」へのカーソルの合わせ方について説明します。


受講者の人に、よく訪ねられるので、、ビルダー作業の「第一の壁? (大袈裟だけど・・)」　なのかもしれません。


ページ幅に合わせる表と文字入力の文字量にあわせたサイズ、2つの作り方　



ココに、一行一列のセル1個を2つ作ってみます。


(A)表の幅に合わせる(A) と、

(B)幅の指定をしないセル(B)を作ってみます。


両方とも、判りやすいように、「枠を表示」します。


表の作り方は、簡単ですね。




メニューバーから、「表」　「表の挿入」でやってもいいでし、もっと簡単なのは、　表の挿入ボタンです。


ココで、
(A)は、下図のようになります。




(B)は、下図のようになります。


この(A) (B) は、状況で使い分けしてください。
真中に表記したいときは、(A)の中に文字や画像を入れて、中央揃えをします。


文字や画像を入れたサイズだけの幅でレイアウトを組むときは、(B)のようにして作ります。

さて、ココでカーソルを合わせて選択です。

(A)でやってみます。
表の枠の内側にカーソル矢印「⇒」をあわせます。

左は、枠線の内側が選択されている状態です。

カーソルは、セルの中にあります。

このまま、文字を入力すれば、文字の幅だけの分、表枠は拡がります。
黒い「ハンドル」と呼ばれる四角い点が、8個、角々と、辺の中間に現われていますが、この左の状態は、表テーブルセルの内側が選択している状態です。


文字を入力してみます。



あいうえお
　　←表記は、このようになります。


次に、カーソル選択で、表枠の外側を選択してみます。

この黒い小さなハンドルマークが、枠線の外側にきていますね。コレは、さっきのとは違います。



ハンドルマークを枠の内側にする、外側にするを切り替える練習。

この選択の切り替えを上手にするように練習してください。

なぜ、この練習が必要か?　というと、表の枠に色をつけた箱を作るときに枠の内側、外側を切り替えて選択する必要があります。

枠線に色をつける方法
ツールバーから、「カラーパレット」を表示します。





←この場合は、ハンドルマークが枠の内側にきていますので、
カラーパレットは、

←左のように、「セル背景色」になっています。　


　　　


さらに、 ←このように、ハンドルマークが枠の外側にきているときの、カラーパレットは、

表背景色になります。














枠の外がわに濃い色をつけて、内側に白、或いは、薄い色にすれば、セルの枠に色がつきます。

セルに色つけする場合は、表枠を「非表示」にしたほうがきれいです。


こういう操作をするにも、カーソルで、表の枠の外・内を選択する練習をして下さい。


上手くマウスで合わせられない場合は、キーボードの←↑→↓　のボタンで思うところを選択できるように練習するのも、もう一つの方法です。

これ以上の詳細は、セミナーを受講してください。(笑)

「表レイアウト」での「入れ子」の使い方

表のレイアウトする場合は、表テーブルの組み合わせを上手に駆使する必要があります。


「表の中に表を入れる」　これが、「入れ子」です。


どういう風に使うかというと、
入れ子の外側の表を、ページ幅に合わせるにして作り、枠を非表示にするのが一般的です。


つまり、外側は、「見えない」レイアウトにします。


入れ子の中の入れ子も、レイアウトによっては、使う事もあります。


その中に入れる表は、「枠の表示・非表示」　を、その状況に合わせて使い分けをします。


また、中に入れる入れ子の表は、「ページ幅に合わせる」は、実際にはあまり使いません。


中央揃え、左揃えなども、ケースバイケースです。


表を、選択するして、右クリックすれば、その表の「属性の変更」が出来ます。


この「属性の変更」で、その表・セルに対して、いろいろな設定でレイアウトの調整ができます。


表の中に入れる文字と、枠までの余白の設定。


文章中に画像などを入れる場合、表を作ってその中に画像を入れます。

その画像の入った表テーブルも、文章中に左寄せにして、右側に文章を表示することもできます。


この場合、ただ、左寄せで右に文章を配すると、画像のすぐ右に、スキマなく文章が配置されますので、画像の入った表の枠の列を右に1列増やして、スペースとして使う事も、テクニックです。

 ビルダー付属のFTPソフトは使わない?

ビルダーで作ったHPの設計図に当たるHTMLファイルや、そのファイルから参照する画像ファイルなどは、そのまま、作りっ放しでは、自分のPCの中にある仮想のウェブサイトに過ぎません。


このファイルをインターネットに接続された「ウェブサーバー」、(略して「サーバー」)にアップロードして初めて、インターネット上に公開されます。


このサーバーと呼ばれる、インターネットに繋がったコンピュータに自分のPCから、HPを構成する部品を全てコピー移動させることを、「アップロード」と呼びます。


アップロードする場合は、「アップロードする為のソフト」が必要になります。


一般的には、これを「FTPソフト」と呼びます。


IBM・HPビルダーには、この「FTPソフト」は付属されています。


しかし、当セミナーでは、この付属された「FTPソフト」は使っていません。


「FFFTP」と呼ばれる、フリーソフトを使っています。


この「FFFTP」は、曽田さんと言う方が作ったプログラムソフトですが、「無料で利用できる」だけでなく、おそらく、「FTPソフト」ではシェアNo.1だと思います。


非常に使い勝手のいいソフトです。


なぜ、ビルダー付属のFTPソフトを使わないか?

これは、実際にやってみると良く分かりますが、ビルダーの編集画面を立ち上げたまま、FTPソフトを同時に使う場合、非常に使い難いからです。


そして、FFFTPの場合は、「アップロード」「ダウンロード」だけの作業をするとき、ビルダーを立ち上げる必要はないのです。
『HP作成の学習をして自作ウェブサイトで稼ごう』(ID:0000170033) 読者登録解除フォーム
メールアドレスを入力してボタンを押すと登録・解除できます。
　バックナンバー
登録フォーム
まぐまぐ
『まぐまぐ！』から発行しています。
当セミナーでは、IBMのHPビルダーを使っています。
TOP PAGE へ戻る
Copyright c 2004 . ATOM. All rights reserved.