区切り線

ホームへ | このサイトについて | サイトマップ | 問い合わせ | 管理人プロフィール

区切り線

ホームページビルダー使い方トップへ>テーブル全体の幅の整合性をチェック

テーブル全体の幅の整合性をチェック

さて、これで各パーツのデザインは終了しました。

ただ、ここで一つ問題があります。

ホームページビルダーは、値段もお手ごろで比較的使いやすいソフトなのですが、いろいろと問題があります。

その一つが、テーブルの幅の整合性がうまく表示されないということです。

例えば、私たちが作っているホームページの幅は、760pxです。

1行目や2行目は、1列しかないので760pxに変更すれば問題ないのですが、3行目を左から右に横断的に見ていくと、4つに分解することができます。

これら4つの値の合計が760pxにならないといけないのですが、これがよくずれていることが多いのです。

4つを足すと760pxを超えており、サーバーに転送してブラウザで表示すると、一部が横にはみ出てしまったりすることがよくあります。

反対に、760pxより小さくて一部が小さく固まってしまったりすることがあるのです。

少し難しいと思うのですが、各セルの幅や高さと全体の整合性をうまく取る必要があるのです。

ですから、ホームページビルダーのプレビュー機能をクリックして、実際にブラウザで見るとどのように見えるのかをチェックしながら、全体のバランスを整えていく必要があります。

試しにに、今作っているホームページをプレビュー機能でチェックしてみます。

写真マーク ↓プレビューする方法

プレビューボタン

写真マーク ↓今作っているホームページをプレビューした写真

ホームページのプレビュー

上の画像が、今作っているホームページをプレビューしたところなのですが、2行目と6行目が左に固まってしまっていますよね。

これは、なぜか、2行目、5行目、6行目の幅が115pxになってしまっているからなのです。

5行目には、何も文字が写真がないので、わかりませんが、HTMLソースを見ると115pxになってしまっています。

ですから、それらの幅を760pxに広げてやる必要があるのです。

次のステップで、HTMLソースを編集して、幅を広げましょう。

戻る   進む

Search

サイト内を検索することができます。

Web製作おすすめ本

↓ホームページビルダーの使い方の基本をおさえたい方におすすめの本です。

できるホームページ・ビルダー12 Windows Vista/XP対応

↓できるシリーズのスタイルシート版です。スタイルシートの基本を押さえておきたいおすすめの本。

できるホームページスタイルシート入門―Windows対応 (できるシリーズ)

↓ホームページビルダーで満足できなくなったら、プロが使うソフトであるドリームウィーバーに乗り換えましょう。

Dreamweaver CS3 Windows版

↓おすすめのエックスサーバー!月額1,050円で1GB+マルチドメイン

↓とりあえずという方のためにおすすめのレンタルサーバーが月額263円からのロリポップ!

ホームページビルダー使い方トップへ>テーブル全体の幅の整合性をチェック