テーブルの配置と編集
次は、メインコンテンツの下の部分。小さい商品写真と商品名、値段が並んでいる部分を作っていきたいと思います。
今、作っているのはサンプルのホームページですので、商品写真も「Sampleimage」と書いてあるサンプル写真を使いたいと思います。
本当は、ここにみなさんの商品写真を並べてください。
まず、４行目は、１列多いので、一番右のセルとその隣のセルを結合します。
４行目の右から二番目のセルをクリックして指定し、「右のセルと結合」ボタンをクリックします。
↓「右のセルと結合」ボタン
これで、２つのセルを１つに結合することができます。
次に、４行目は、さらにテーブルが入っています。テーブルの中にさらにテーブルが配置されている状態になっています。
↓テーブルの中にさらにテーブルが入っていることを確認してください。（緑の部分）
「テーブルでラフなレイアウトを作る」でやったように、４行目の一番右のセルをクリックして指定し、「表の挿入」ボタンをクリックして、４行６列の表を挿入してください。
↓ここまでの解説を動画で見る。
テーブルが配置できたら、以前にやったようにＨＴＭＬを編集して、枠を消して幅を調節します。
今、作成したテーブルの一番左上のセルをクリックすると、下のＨＴＭＬソースの表示領域に、
<table border="1">
、という部分が表示されます。
つまり、外枠が「１」のサイズで表示され、幅の設定はまだされていません。
これを、
<table border="0" width="590">
に変更してください。
↓ここまでの解説を動画で見る。
これでテーブルの枠を消すことができ、幅も広げることができました。
次は、写真を配置していきましょう。
Search
サイト内を検索することができます。
Links
Ｗｅｂ製作おすすめ本
↓ホームページビルダーの使い方の基本をおさえたい方におすすめの本です。
↓できるシリーズのスタイルシート版です。スタイルシートの基本を押さえておきたいおすすめの本。
↓ホームページビルダーで満足できなくなったら、プロが使うソフトであるドリームウィーバーに乗り換えましょう。
↓おすすめのエックスサーバー！月額１，０５０円で１GB+マルチドメイン
↓とりあえずという方のためにおすすめのレンタルサーバーが月額２６３円からのロリポップ！
