締切済み この表(テーブルレイアウト)をソースにしてください 2009/06/08 18:46 添付した図のような表をテーブルレイアウトで 作るとどうなるかおしえてください。 (ソースを載せてください) 画像を拡大する みんなの回答 (3) 専門家の回答 みんなの回答 fujillin ベストアンサー率61% (1594/2576) 2009/06/08 22:57 回答No.3 セルの幅のクラスと、ボーダー表示の有無のクラスを作っておいて、組み合わせて指定してあげればできそうですが… とりあえず、こんな感じ? <html> <head> <style type="text/css"> table { border-collapse: collapse; empty-cells:show; } table td { height:20px; border:1px solid gray; } table .w1 { width:60px; } table .w2 { width:100px; } table .w3 { width:25px; } table .n { border:0; } </style> </head> <body> <table> <tr><td colspan=3 class="n"></td><td class="w2"></td><td colspan=2></td></tr> <tr><td class="w1"></td><td colspan=2></td><td></td><td class="w2"></td><td class="w3"></td></tr> <tr><td></td><td colspan=2></td><td></td><td></td><td></td></tr> <tr><td></td><td colspan=2></td><td></td><td></td><td></td></tr> <tr><td class="n"></td><td class="w1 n"></td><td class="w1"></td><td></td><td></td><td class="n"></td></tr> <tr><td colspan=2 class="n"></td><td class="w1"></td><td></td><td></td><td class="n"></td></tr> </table> </body> </html> 広告を見て全文表示する ログインすると、全ての回答が全文表示されます。 通報する ありがとう 0 darter ベストアンサー率48% (12/25) 2009/06/08 22:12 回答No.2 No.1のdarterです。 よろしければこの質問の目的をもう少し具体的に教えていただけませんか? セルの幅などにも意味があるのでしょうか。 表示ができればいいだけであれば、エクセルで作成した冗長なソースでも問題ないかと思いますが、 テーブルは特に何も指定しないと、セル内の文字列やブラウザの種類、ウインドサイズによって適当に解釈されてレイアウトされるため、一定になりません。 広告を見て全文表示する ログインすると、全ての回答が全文表示されます。 通報する ありがとう 0 darter ベストアンサー率48% (12/25) 2009/06/08 20:53 回答No.1 線のない部分もあるのでスタイルも指定しないと難しいかも知れません。 こういう作業はベタに打たず、WYSIWYGな編集ソフトを使ったほうが楽ですよ。 専用の編集ソフトがなくても、もしエクセルをお持ちなら エクセルで希望の表組みを作って、 ファイル → 名前をつけて保存 で、ファイルの種類を「Webページ」にして 保存すると、HTMLコードが作れます。 質問者 お礼 2009/06/08 21:31 ご回答ありがとうございます。線のない部分もあるので難しいですよね >スタイルも指定しないと難しいかも知れません CSSを利用するということでしょうか。 あまり、経験がないのでCSSも使い方がよくわかりません。 エクセルでもやってみましたが、かなり見ずらいコードになってしまいました。 初心者の私にはこのテーブルレイアウトを作るのは無理なのでしょうかね。 広告を見て全文表示する ログインすると、全ての回答が全文表示されます。 通報する ありがとう 0 カテゴリ [技術者向] コンピュータープログラミング・開発HTML 関連するQ&A tableレイアウトについて。 自分は HTML , CSSを勉強して、ホームページをつくっていたのですが、いざ、就職をしてみると、ホームページのソースが自分が今まで、勉強してきた HTML, CSSは使われておらず、tableレイアウトでつくったホームページを沢山、目にします。特に楽天やYahooなどECサイトなどで多くみられます。自分は HTML, CSSをつかって <div></div>でレイアウトをするのが正しいとおもいやってきたのですが、このさき、tableレイアウトで作るやり方も勉強するべきでしょうか? htmlのtableレイアウトについて こんばんは。訳あってcssとテーブルの両方のレイアウト手法を用いた サイト作りをしています。準初心者です。 昔から受け継がれてきたサークルのサイトの更新担当をしているのですが、 テーブルレイアウトとcssレイアウトがごちゃまぜで、わけの分からないスペーサーgifなど も多用されていたりと、悲惨な有様なので、必死に修復しているところです。 テーブルレイアウトとで組まれていても、今回は抜本的な対策は留保するつもりで書いていた のですが、ある問題に突き当たりました。 divタグ内のtableタグによって作られた1×1の表ボックスが更新情報欄になっていて、 ページの左端に隙間無くくっついているようなレイアウトにしようと試みました。 <TABLE style=" border:0px;padding:0px;margin:0px;・・とするとdivのブロック要素と テーブルが完全にくっついた状態にできると思い実践してみたのですが、どうしても何pxかの隙間が生じてしまうのです。試行錯誤の末、もとのソースコードではtable要素にhtmlでwidth="400" と指定されていたものをtableタグ内に <TABLE style=" border:0px;padding:0px;margin:0px; width:400px;> と指定し直した結果、計らずしもこの隙間は無くなりました。 そこで疑問なのですが、なぜこのような結果になったのでしょうか、ご教授ください! テーブルレイアウトとは テーブルレイアウトとは,テーブルタグを表以外のコンテンツなどに使うことでしょうか? http://okfood.digiweb.jp/index.htmlのコンテンツもテーブルレイアウトなのですよね。 このサイトの場合、同じような見た目にするにはdivを縦横に重ねて、thの毎度縦幅をCSSでかえて行うのでしょうか? 大変過ぎてやっていられなくないですか? WEBデザイナーはそこまでやっているのでしょうか?それとももっと便利な方法があれば教えてください。 SEO上も不利なのでしょうか? table内の文字を軽視されるのでしょうか? ネットワークエンジニアとは?技術職の未来を考える OKWAVE コラム テーブルレイアウトについて教えてください ホームページをテーブルでレイアウトしたいと思っています。 テーブルレイアウトをするときに、やってはいけない事を教えてください。 また、こうすると良くなるなんて方法もあったらぜひ教えてください。 よろしくお願いします。 tableによるレイアウトorCSSによるレイアウト 現在HPをリニューアルしようとしております。 現状はホームページビルダーでテーブルを多用してレイアウトしておりました。 洋服関係のネットショップなのでかなり見た目ごちゃごちゃした感じで作っています。 また、「生きているサイト」を意識して頻繁に少々のレイアウトや内容の更新をしております。 *商品はコンスタントに更新してます。 このたび、dreamweaverでhtml+CSSでブロック要素のまわり込みでレイアウトして作りかけています。 がしかし、参考に他のサイトのソースを多数見ていくとレイアウト自体はテーブル(html)で行っているサイトが多く現在、レイアウト自体をテーブル( html)orCSSでコントロールする方法が良いか迷っております。 html+CSSでブロックコントロールしていく方法を多方面推奨しているようなのですがブラウザやブラウザバージョンにより崩れたり・・・とういう事は理解できております。 そこでお教え頂きたいのですが・・・ ●今後CSSがスタンダードになるとは思いますが現状、web製作の現場ではTABLEによるレイアウトとCSSによるレイアウトどちらがスタンダードでしょうか? ●また、CSSの場合、<div>のまわり込みでレイアウトを決めて<div>内のレイアウトはどのようにすればフレキシブルに内容や画像を取り扱えるでしょうか? ●その他、お気づきの点があればご意見ヨロシクお願い致します。 レイアウトテーブルの中にレイアウトテーブル配置について たびたびよろしくお願いします。 使用ソフトはDreamWeaverMx2004です(Mac)。 いま、レイアウトテーブルの中に更にレイアウトテーブルを配置し、 その中にレイアウトセルを配置したいのですが、どうも表示がうまくいきません。 レイアウトテーブルの中にレイアウトテーブルを満杯まで配置しているはずなのに、 ブラウザで確認すると、下に余白部分のようなものが出てしまいます。 レイアウトテーブルの中にレイアウトテーブルを更に配置するということは 仕様上、うまく表示されなくなってしまうのでしょうか? 普通に2カラムのレイアウトをしたのですが、なぜか添付画面中央のテーブル 普通に2カラムのレイアウトをしたのですが、なぜか添付画面中央のテーブルのcellpaddingがききません、、、、、。なんども確認して見ましたが、ソースは間違えていないようです。 どなたか原因がわかるかたご回答お願いします。 テーブルレイアウトの外側 こんにちは。 現在テーブルレイアウトでホームページを作成しています。 http://www.shoshinsha.com/hp/ のようにテーブルレイアウト内側を白にして、何もないことがわかる様にテーブルレイアウトの外側を黒とか色を変えたいのです。 何かアドバイスをお願いします。 レイアウトして表を作りたい 説明が難しいのでこんな表が作りたいのでどうすればいいですか? □□□□□□□□□□□□■■■■■■■□ □□□□□□□□□□□□■□■□■□■□ □□□□□□□□□□□□■■■■■■■□ □□□□□□□□□□□□■□■□■□■□ □□□□□□□□□□□□■■■■■■■□ □□□□□□□□□□□□■□■□■□■□ □□□□□□■■■■■■■■■■■■■□ □□□□□□■□■□■□■□□□□□□□ □□□□□□■■■■■■■□□□□□□□ □□□□□□■□■□■□■□□□□□□□ □□□□□□■■■■■■■□□□□□□□ □□□□□□■□■□■□■□□□□□□□ □□□□□□■■■■■■■□□□□□□□ ■■■■■■■□□□□□□□□□□□□□ ■□■□■□■□□□□□□□□□□□□□ ■■■■■■■□□□□□□□□□□□□□ ■□■□■□■□□□□□□□□□□□□□ ■■■■■■■□□□□□□□□□□□□□ ■□■□■□■□□□□□□□□□□□□□ ■■■■■■■□□□□□□□□□□□□□ ようは3個の表をずらして表示させたいのです なにか表をレイアウト(位置を決める)ようなタグはあるのでしょうか!? 教えてください レイアウトはテーブルよりCSSですか? 今まで、Webサイトのレイアウトは、テーブルを何重にも入れ子にして、行ってきました。 最近、「レイアウトにテーブルを使うのはよくない」「テーブルで全体を囲っているレイアウトはダサい」などの意見を聞くようになってきました。 奮起して、テーブルでつくったページをCSSに書き換えようと思いましたが、なかなか困難です。 位置を左上基点に、それぞれの<div>をabsoluteで設定すれば、比較的容易にレイアウトを組めるのですが、やはり全体を画面の中心に持っていきたい、そうなると、全体をテーブルで囲って、align="center"が簡単です。 そこで、質問です。 ・CSSでレイアウトを組むとき、左上を基点にされていますか?全体を中央に配置するようにされていますか? ・CSSで、全体を中央に配置するとき、全体を<div>で囲って、その中に<div>を入れ子にして、配置していくと思いますが、なかなか思い通りの配置になりません。このやり方であっていますか?簡単なやり方がありますか? ・やはり、レイアウトにはテーブルよりも、CSSを使ったほうがいいですか? ご意見・ご回答いただきたく、どうぞよろしくお願いします。 テーブルのレイアウトがうまくいきません DreamweaverMXで簡単なホームページを作っています。 テーブルをつかってレイアウトをしようと思いましたが、思うようになりません。やり方が間違っているのでしょうか? まず大枠で1行3列のテーブルを作り、幅だけ800pに指定。(高さ指定はしていません) 両端の列はそれぞれ幅だけ180pに指定。 で、そのそれぞれの列の中にまた必要なテーブルを作ってレイアウトしようとしてるのですが 一番左の列の中にテーブルが3つ入っていて一番縦長になっています。真ん中と右の列にも必要なテーブルや画像を入れているのですが左の列が長いせいかそれぞれの列の一番上がそろいません。左の列の長さに合わせて一番大外のテーブルの高さが決まってしまってしまいますが、真ん中と右の列の中のテーブルたちは左の列の高さの真ん中に配置されてしまいます。 方法がまずいのでこうなってるのだとは思いますが、本を見ながら勉強しつつやっていますが思うようにいかないので質問させてもらいました。 一番上をツライチに合わせるにはどうすればいいのでしょうか? というか上記の方法の悪いところを指摘していただければと思います。よろしくお願いいたします。 テーブルを使ったレイアウトで HTMLの初心者です。 テーブルを使ってレイアウトを作りました。 データを書込まないテーブルのみですと問題なく表示できているのですが、データを書込むとHPの下(フッター?)にふんどしのように長く、空白の部分ができてしまいます。 何かを間違えているのだと思うのですが自分ではわかりません。 ご指導よろしくお願いいたします。 AIは使う人の年齢や市場にも影響する?人工知能の可能性 OKWAVE コラム DreamweaverMXのレイアウトテーブルについて お世話になります。 Dreamweaverのレイアウトテーブルについて質問がございます。 最近ホームページビルダーからDreamweaverへ移行いたしまして、苦戦しながらもなんとか形になってきました。 何時間かやっているうちに2点ほど疑問があがりましたので、質問させていただきます。 1.レイアウトを決めてからそこに画像を入れていくという方式をとっているのですが、なぜかレイアウトテーブル(緑)の中のレイアウトセル(青)に画像を入れるとレイアウトセルがちょっと大きくなってしまいます。画像はセルと全く同サイズです。原因はなんでしょうか? 2.レイアウトテーブルなんですが、枠を表示することはできないのでしょうか?プレビューを見てみると、画像だけが浮き上がって見えるような感じになっています。 お手数をおかけいたしますが、ご見識のあるかたがいらっしゃいましたら何卒ご指導お願いいたします。 テーブルレイアウトでのホームページ作成について。 テーブルレイアウトでのホームページ作成について。 今度、テーブルレイアウトで作られたホームページの仕事をすることになりました。そこで、本屋でテーブルレイアウトを使ったホームページ作成本を探してみたのですが見つかりません。 おそらく古い本しかないとは思うのですが、テーブルを使った詳しいホームページ作成の解説書をご存知の方がいらっしゃいましたら教えて頂けないでしょうか? よろしくお願いします。 DreamWeaver レイアウトテーブル?セル? 素人です。よろしくお願いします。 レイアウトテーブルとレイアウトセルはどのように 使い分けすればいいのかわかりません。 全部テーブルでレイアウトすると問題はありますか? テーブルとセルの使い方が詳しく載っているサイトがありましたら 教えて下さい。 なお、テーブル、セルを使う必要性などご指導頂ければありがたいです。 よろしくお願いします。 テーブルレイアウトのメリット 新規でサイトを作成する場合、テーブルでレイアウトするメリットって何かありますか? 条件としては、 ・SEOを地道にしっかりやりたい ・被リンクはあまり張れない ・制作会社として客の信頼を得、しっかり伸びていきたい ・更新業務も効率化させたい ・仕事を増やしていきたい この様な場合、テーブルレイアウトで新規サイトを作っている事をどう思われますか? テーブルのレイアウトの印刷 テーブルで設計したフィールド等のレイアウトの印刷の仕方を教えて 下さい。 Tableとdivタグで、レイアウト Tableとdivタグで、画像のようなレイアウトを作りたいのですが。 黒い線を二本入れた簡単なレイアウトなのですが、 どのブラウザーで見ても、(どの画面の大きさで見ても) 同じような形になるように、tableとdivでレイアウトするにはどうしたらよいでしょうか。 metaタグなど余計なものは書かなくてもかまいませんのでよろしくおねがいします。 (後パーセンテージもいくつでも構いません、適当に書きました) tableで書いた場合と、divで書いた場合と教えてください。 縦横ともに長さ100%で表示したいです。 パーセンテージを使うとかける気がするのですが、忘れてしまいました。 ぜひよろしくお願いします。 掲載画像のレイアウトはテーブルレイアウトで実現? 掲載した画像のようなホームページのレイアウトはテーブルを何重にも組み合わせて (テーブルを何重にも入れ子にして)実現するのが最近の一般的な手法なのでしょうか このようなホームページのレイアウトのコーディング方法の概略を教えてください。 webデザイン素人のためなるべく詳しく丁寧に教えていただけると助かります。 ビルダー14のレイアウト枠とテーブルの使い方 ホームページビルダー14を使用しています。レイアウト枠とテーブルとは違うものなのですか?どういうページ全体のレイアウトを決めていく際、どちらを使って進めていけばいいでしょ 注目のQ&A 「You」や「I」が入った曲といえば? Part2 結婚について考えていない大学生の彼氏について 関東の方に聞きたいです 大阪万博について 駅の清涼飲料水自販機 不倫の慰謝料の請求について 新型コロナウイルスがもたらした功績について教えて 旧姓を使う理由。 回復メディアの保存方法 好きな人を諦める方法 小諸市(長野県)在住でスキーやスノボをする方の用具 カテゴリ [技術者向] コンピューター プログラミング・開発 Microsoft ASPC・C++・C#CGIJavaJavaScriptPerlPHPVisual BasicHTMLXMLCSSFlashAJAXRubySwiftPythonパフォーマンス・チューニングオープンソース開発SEOスマートフォンアプリ開発その他(プログラミング・開発) カテゴリ一覧を見る OKWAVE コラム 突然のトラブル?プリンター・メール・LINE編 携帯料金を賢く見直す!格安SIMと端末選びのポイントは? 友達って必要?友情って何だろう 大震災時の現実とは?私たちができる備え 「結婚相談所は恥ずかしい」は時代遅れ!負け組の誤解と出会いの掴み方 あなたにピッタリな商品が見つかる! OKWAVE セレクト コスメ化粧品 化粧水・クレンジングなど 健康食品・サプリ コンブチャなど バス用品 入浴剤・アミノ酸シャンプーなど スマホアプリ マッチングアプリなど ヘアケア 白髪染めヘアカラーなど インターネット回線 プロバイダ、光回線など
お礼
ご回答ありがとうございます。線のない部分もあるので難しいですよね >スタイルも指定しないと難しいかも知れません CSSを利用するということでしょうか。 あまり、経験がないのでCSSも使い方がよくわかりません。 エクセルでもやってみましたが、かなり見ずらいコードになってしまいました。 初心者の私にはこのテーブルレイアウトを作るのは無理なのでしょうかね。