HPB18 | HPB19 コンテンツ一覧
ホーム > HPB19 > ページのレイアウトに表を活用しよう
目次 | 元のページ 前のページ | 次のページ サイトマップ | ページEND

ホームページビルダー19 ページのレイアウトに表を活用しよう


ホームページビルダー19 ページのレイアウトに表を活用しよう



表(テーブル)というと、Excelとかの表計算を連想されるかもしれませんが、ホームページビルダーの表は、計算には使えません

ただ、Excelをワープロ代わりに使われている方は、表を利用した際の、そのレイアウト性のよさに気付かれていることと思います

ホームページビルダーで、ホームページを作成する際も、ページを画面の中央に配置するとか、段組みするとか、行頭を整えるとか、とても便利に使えます

本サイトでも、基本的に、全てのコンテンツを、表の中に記述しています



ホームページビルダー19 文字入力




「ページ編集」画面で、そのまま文字入力します

この画面を、「ブラウザ確認」 → 「InternetExplorer」で、見てみます
ホームページビルダー19 左端表示




全体が左端にくっついてしまい、見辛いですよね
ホームページビルダー19 中央表示




もちろん、動かしたいところを選択して、「ホームページビルダー19 中央表示設定」クリックで、中央に持ってくるとかはできるのですが、柔軟性がありません

特に、画像を文章の横に持ってきて、きれいに見せるとかは、至難の業です
ホームページビルダー19 表を挿入する




表を入れたい場所(この場合ページの先頭です)をクリック→「表の挿入」ホームページビルダー19 表の挿入をクリックします
ホームページビルダー19 表の行列設定




ここでは、例として、「行数」に「3」、「列数」に「2」を入力し、「OK]をクリックします
ホームページビルダー19 表の挿入完了




ページの先頭に表が挿入されました
ホームページビルダー19 表を中央に移動




表を選択して、同じく中央に持ってきます

表の選択時は、表のある行の右の方、なるべく離れた位置でクリックして、表全体が赤枠で囲まれたらOKです

ホームページビルダー19 中央揃える」クリックで、中央に移動させて下さい
ホームページビルダー19 表の全セル選択




このままでは、表が小さくて扱い辛いので、広げましょう

中身を入れれば自動的に広がるのですが、サイト内の全ページで統一感を持たせるため、固定値を設定します

表の中の全セルをドラッグして、全セルが選択された状態にします
ホームページビルダー19 表の属性変更




表の上で右クリック → 「属性の変更」をクリックします
ホームページビルダー19 表の幅設定




右端の「表」タブをクリック、「表の幅」に「600」と入力し、「OK]をクリックします

注.ご使用の画面に合わせて、適当な値で構いません
ホームページビルダー19 表の幅設定後




後は、表の中の各セルに、適当に文字列等をカット&ペーストで配置するだけです
ホームページビルダー19 表に入力




例えば、こんな感じ
ホームページビルダー19 表のブラウザ表示




ブラウザ表示すると、こうなります
ホームページビルダー19 表の上付き設定




全セルを選択して、「上付き」ホームページビルダー19 上付き設定をクリックします
ホームページビルダー19 表の上付き設定後ブラウザ表示




ブラウザ表示はこうなります
ホームページビルダー19 表のセル結合




ついでに、右側列の3セルを選択して、「選択セルの結合」をクリック

両列の先頭に改行を入れると
ホームページビルダー19 表のセル結合後ブラウザ表示




こんな風な表示もできます
ホームページビルダー19 表のセル分割




左列2行目のセルを横に分割してみます

分割したいセルの上で右クリック → 「セル」 → 「セルを横に分割」をクリックします

下のセルからカット&ペーストでセルの中身を持ってきて、スペースを入れたりして整形すると
ホームページビルダー19 表のセル分割後ブラウザ表示




こんな風な表示もできます


「セル結合」と「セル分割」を組み合わせると、お好みのレイアウトに仕上げることができます



お断り  説明内容に支障のないところでは、ホームページビルダー18 のハードコピーが使われておりますこと、ご了承下さい

目次 | 元のページ 前のページ | 次のページ サイトマップ | ページTOP
ホーム > HPB19 > ページのレイアウトに表を活用しよう
HPB18 | HPB19 コンテンツ一覧
   

© 2014 abhp.net All Rights Reserved.
ページTOP
ページTOP
ページTOP
ページTOP
ページTOP
ページTOP