- 締切済み
テーブルではなく出来るだけCSSでサイトを作りたい・・・
変な質問で申し訳ありません。 テーブルで組むのではなく 出来るだけCSSでサイトを作りたいと思うのですが テーブルの場合はDreamWeaver上で制作の際 実際のHPと同じような見た目で作っていけますが CSSで組むと、DreamWeaverで制作途中、実際の完成版と 違って変なすきまが空いたり、抜けていたり・・・でも プレビューすると一応出来ているというような現象に かなり違和感というか戸惑いがあります。 テーブルで慣れてしまっているだけに。 これはどう克服したらいいのでしょうか。 WEB技術者の方どうかご指導宜しくお願いします。
- HTML
- 回答数3
- ありがとう数2
- みんなの回答 （3）
- 専門家の回答
みんなの回答
- 神崎 渉瑠（@taloo）
- ベストアンサー率44% (1016/2281)
- k0021
- ベストアンサー率26% (32/120)
- STICKY2006
- ベストアンサー率29% (1536/5269)
こんちくは。 >>DreamWeaver上で制作の際 いつもテキストエディタ派なので、DreamWeaverを使用した事なくなんともいえませんが。。。 >>これはどう克服したらいいのでしょうか。 実際の環境で見ながら作るのが一番確実かと思ってます。 ホームページビルダーなら使ったことがあるのでイメージとして似た感じなら。。。 作成はビルダーで。 ↓ ファイル保存。 ↓ 保存したファイルをWebブラウザで開いて確認。 を繰り返す。 （ファイル上書き保存、ブラウザで更新。でもいいんですけどね。 どっちにしろ、実際の表示と違うけどどうしたらいいんだろう。。。 だったら、実際の表示を見てみるのが一番確実ですよ。 テキストエディタでソース書いて、ちょこちょこいじれるようになると、ブラウザで見る以外確認方法がないので、ある意味なれるとは思いますよ。
お礼
お答えありがとうございます。 テキストエディタ派ですか。 楽せず自力で書かなければだめですね・・・ 反省です。 Dreamweaverのスニペット機能 (よく使うタグを登録しておけばそれを押すだけでタグが ズラズラっと出てくる・・・ 2カラム3カラムも保存しておけばズラズラ・・・っと。) を最近知り使ってみたい衝動に駆られていましたが 我慢し、出来るだけテキストエディタで頑張ってみようと思います。 タグを打つだけで、イメージが頭に浮かぶ位になるまで 頑張ってみます。ありがとうございましたm(__)m
関連するQ&A
- テーブルが変！
いつもお世話になってます。DreamWeaver8でサイトを制作している者です。 サイト制作でテーブルを使用するのですが、2行にして縦幅は別々の長さにする予定です。 ですが、編集画面ではちゃんと縦幅は狭いのに、プレビューするとその縦幅が広くなってしまいます。 ―――――――――――――――――――― ―――――――――――――――――――― ―――――――――――――――――――― ↑編集ではこのようになっているのに ―――――――――――――――――――― ―――――――――――――――――――― ―――――――――――――――――――― ↑ブラウザでプレビューすると広くなってしまいます。 【高さ】を設定してもこのような結果になってしまいます。 レイアウトの仕方が変なのでしょうか・・・？？
- ベストアンサー
- HTML
- ページの幅が変わってしまう問題について（CSS）
CSSレイアウトついての質問です。 DreamWeaverで作ったサイトを、ブラウザでプレビューしてパッと見は問題ないのですが、 サイト内でページを切り替えたときに、 ページの横幅が微妙に狭くなったり広くなったりする現象が起きたときは どういった対処をすればいいのでしょうか？ WEB制作に詳しい方、お知恵を貸してくださると嬉しいですm(_ _)m よろしくお願いします。
- ベストアンサー
- HTML
- 【HTML＆CSS】テーブルの正しい作り方
はじめまして。 Webページで、テーブルを作成する際の正しい手順について迷ってしまっているので、ご助力いただければ幸いです。 現在、XHTML1.0TとCSSでページを作成しています。 テーブルの作成は以前からしていましたが、CSSが絡むようになってから、どの方法がベストなのかがわかりません。 作成はDreamweaverとテキストエディタでの手書きと両方行っています。 疑問を抱いているのは、以下の点です。 ☆ HTMLの<table>に対するborder属性、width属性、cellspacing属性、cellpadding属性は使用するべきなのか？ 今現在は、<table><tr><th><td>のみで骨格を作成し、属性指定は行っておりません。するとすればthのscope属性くらいです。 ボーダーの指定には、table th tdそれぞれにCSSで上下左右のボーダー指定を行い、border-collapseプロパティで、セル間の隙間をなくしています。横幅もCSSのwidthプロパティを使用しています。 セル内の余白については、thやtdに対してpaddingプロパティで指定をしております。 この方法で特に問題なくできてはいるのですが、実際にwidth border cellpadding cellspacingの属性がいまだに非推奨になっていないようですし、ちょっと不安です。 みなさんはどのように作成しているのでしょうか？ Dreamweaverの参考書などでは、tableに対して上と左のボーダー、tdに対して、右と下のボーダーを指定して、border-collapseで隙間をつぶす方法が紹介されていたりもしました。 ただ、自分は、tdの上下左右のボーダーを指定してborder-collapseで隙間をなくしていますが、結果は同じ表記になります。 tableに上と左のボーダー、tdに右と下のボーダーと指定すること自体にはどのような意味があるのでしょうか？ 混乱しているため、少々文章がおかしくなっているかもしれません。 意味が分かりづらい部分がありましたら、補足させていただいたいと思っています。 どうぞよろしくお願いいたします。
- ベストアンサー
- HTML
- なぜtableを使うの？
現在、WEB制作の勉強中の者（初心者）です。 以前勤めていた不動産会社が、ある大手の制作会社にホームページリニューアルの依頼をしました。 料金は400万円とのことです。（汗） で、先日完成したのでソースを見てみると、tableが多用されているのです。 もちろんCSSファイルもリンクされているのですが、htmlソースの至るところにtableが組み込まれています。 私は、tableを使わず（初心者または表のようなものを作る場合はともかく）cssを使うのが一般的だと習ったのですが、わざわざtableを使うメリットって何かあるんでしょうか？ ご回答宜しくお願いします。
- ベストアンサー
- その他（インターネット・Webサービス）
- tableのwidthのようにどちらでも設定できる場合はhtmlそれともcss
ただ今、html+cssでホームページを作成しております。 この前まではホームページビルダーにて作成しておりましたが 現在dreamweaverにて製作しております。 せっかくなのでわからないながらも勉強しつつcssでなるべく簡素化した htmlのソースを心がけて作っております。 ここで疑問があり足踏み状態なのですがhtmlでもcssでも両方で指定できるものが数多くあります。 例えばtableやtdのwidthや背景などhtml、cssどちらでも指定できる場合 どちらで指定したらよろしいのでしょうか？ また、文字色等はhtmlでの指定は推奨されていないことは存じておりますが 実際の現場ではどうなのでしょうか？ 非推奨の事項を全部把握しておりません。 参考になるサイトがあればお教え頂ければ幸いです。 勉強中の身で大変初歩的なことかも知れませんがどうぞよろしくお願いいたします。
- ベストアンサー
- HTML
- なぜyahooなどはCSSじゃないんですか？
とても初心者です。 最近CSSを勉強しているのですが、疑問があります。 CSSの重要性や今後のCSSの役割などそれなりに理解を深め素晴らしい技術だと思い、私も使いたいと思っています。 しかし、大手ポータルサイトなどは何故全てテーブル構成なのでしょうか？動的なサイトはCSSは使えないものなのでしょうか？とても不思議です。 また、yahooのトップページをテーブルを使わずにCSSのみで構成することは可能でしょうか？多分可能ですよね？ この場合、全てCSSで構成するということはコーディング上正しいのですか？逆にテーブルを使うのが普通といいますか、本来の使い方なのでしょうか？ とても変な質問ですが、お分かりになる方がおられましたらよろしくお願いいたします。
- ベストアンサー
- HTML
- テーブルの設定方法を教えて下さい。
Dreamweaver MX2004を使用しています。 画像を画面の中央（横・縦とも）に表示したいです。 テーブルの幅・高さとも１００％にして、セルの横・縦とも中央に設定して画像を貼り付けてプレビューで見てみるのですが、縦が中央になりません。制作画面では中央になるのですが、プレビューでは画面の一番上に表示されてしまいます。 ビルダーでは簡単に出来るのですが、どこが悪いのでしょうか？ お分かりの方、よろしくお願い致します。
- ベストアンサー
- ホームページ作成ソフト
- ホームページビルダーでcssレイアウトは可能ですか？
Web制作初心者です。 Htmlのtableでトップページ全体をレイアウトすると、読み込みが遅くなるそうですが、ホームページビルダー9を使っているため、レイアウトを作るのは簡単にすみ、いままでtableで作成してきました。 今度、新たにサイトを作るのですが、cssでレイアウトを作りたいと思います。そこで、ホームページビルダー9はcssでtableのようなレイアウトを作ることは可能なのでしょうか？ tableの場合は、「表の挿入」を選んで、「行の追加」や「列の追加」、「選択セルの結合」とかでどんどん表を作っていって、セルに画像追加や文字を書いていました。 こういうのはcssでは（ホームページビルダー上では）どのようにするのでしょうか？ あと、tableを作って、その下にもtableを追加していくと、ページをプレビューした場合、下のほうに行くにつれてそれぞれの表がズレていきます。cssではズレないようにできるのでしょうか？
- ベストアンサー
- ホームページ作成ソフト
- DreamweaverMXのレイアウトテーブルについて
お世話になります。 Dreamweaverのレイアウトテーブルについて質問がございます。 最近ホームページビルダーからDreamweaverへ移行いたしまして、苦戦しながらもなんとか形になってきました。 何時間かやっているうちに2点ほど疑問があがりましたので、質問させていただきます。 1.レイアウトを決めてからそこに画像を入れていくという方式をとっているのですが、なぜかレイアウトテーブル(緑)の中のレイアウトセル(青)に画像を入れるとレイアウトセルがちょっと大きくなってしまいます。画像はセルと全く同サイズです。原因はなんでしょうか？ 2.レイアウトテーブルなんですが、枠を表示することはできないのでしょうか？プレビューを見てみると、画像だけが浮き上がって見えるような感じになっています。 お手数をおかけいたしますが、ご見識のあるかたがいらっしゃいましたら何卒ご指導お願いいたします。
- 締切済み
- ホームページ作成ソフト
- DreamWeaverでテーブルをCSSにした場合にずれます。
DreamWeaverを使い始めました。 CSSの段組左にテーブルを入れると下記のようになりました。 ----------------------- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis" /> <title>無題ドキュメント</title> <style type="text/css"> <!-- #wrap { width: 500px; } #content { float: left; width: 200px; background-color: #00CCCC; } #main { width: 300px; float: left; background-color: #99FF99; } #footer { clear: both; width: auto; background-color: #CCFF66; } --> </style> </head> <body> <div id="wrap"> <div id="content"> <table width="200px" border="0" cellspacing="0" cellpadding="0"> <tr> <td>1段</td> </tr> <tr> <td>2段</td> </tr> </table> </div> <div id="main">メインメインメインメインメイン</div> <div id="footer"> 下</div> </div> </body> </html> -----↑ここまでDreamWeaver そこで、CSSでテーブルにボーダー0の値を入れて、タグからborder="0"を消すと、段組右側が左の下にずれて表示されます。 ブラウザプレビューでは正常ですが、編集しにくくて困ってます。 table { border: none; border-collapse: collapse; } DWでは、このようになるものなのでしょうか。
- ベストアンサー
- HTML
お礼
ありがとうございます。 やはり、手打ちですか。 最初はドリームウィーバー禁断症状が出そうですが とりあえず今は我慢して手でタグ打ちするように 努力してみます。 クロスブラウザで全然見え方が違ってきてしまうから やっかいですよね。