親子におすすめの新型プラネタリウムとは?

普段タグ入力でWebページを作っているのですが、
Dreamweaver CS4で読み込んだところ、デザインビュー画面のレイアウトがぐちゃぐちゃになっています。
ライブビューや、実際のブラウザで見るときれいに表示されますが、これは私の作り方が間違っているんでしょうか?

普段Dreamweaverを使っている方は、どのような使い方をされているかも知りたいです。

このQ&Aに関連する最新のQ&A

A 回答 (3件)

DreamWeaverのデザインビューはほとんど使われていないと思います。


floatやposition周りのCSSがかなり適当に表示されます。
正直、IE6よりひどいときもあります。

デザインビューはWYSIWYGエディタ代わりに使う程度で、
ワープロ感覚でリストやテーブルをささっと組みたいときや、
プログラムのコードをページ内で使用したいときに
デザインビューにコードを貼り付けると<や>が文字参照(&xx;)に自動で変わるなどで役に立ちますが、
デザインの完成具合をチェックするときには使いません。
    • good
    • 0
この回答へのお礼

なるほど、たしかにfloatや絶対位置指定を使うと飛んでいってしまうように見えます。

せっかく安くないソフトを買ったのにテキストエディタ代わりにしていてはもったいないと思っていましたが、そういうソフトなのかもしれないですね。

お礼日時:2009/09/25 17:23

>テキストエディタ代わりにしていてはもったいない



はい?
DreamWeaverはテキストエディタですよ。

デザインビューはおまけの機能であって、
ブラウザでの表示確認の代わりになるものではありません。
    • good
    • 0
この回答へのお礼

なるほど、ということは私の使い方も間違ってはいないわけですね。
とはいえ業界標準のソフトで正常に表示できないというのはなんとなく不安になってしまいます・・・。

お礼日時:2009/09/26 14:41

CS4 では以前ほどデザインが崩れなくなったと思いますが・・・。


ちなみに、Dreamweaver は clearfix のハックを入れると、レイアウトが崩れる問題があるそうです。

http://www.renewda.com/detail_6.html

参考にならないでしょうか。
    • good
    • 0
この回答へのお礼

clearfixは使っていないのですが、floatでレイアウトが崩れている気がします。
かといって使わないわけにもいかないんですよね・・・。

お礼日時:2009/09/25 17:25

このQ&Aに関連する人気のQ&A

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aを見た人が検索しているワード

このQ&Aと関連する良く見られている質問

QDWで、デザインビューに表示されないのはどうして?

おはようございます。
よろしくお願い致します。

知人からHTMLのソースを受け取り、編集しようと思っています。
ところが、DWで開くと、タグは全部あるのに、デザインビューでは途中がすっぽり抜けているのです。
でも、ブラウザのプレビュー機能で見ると、ちゃんと全部表示されているんです。
どうしてでしょうか?
どうやったらデザインビューにも全部表示されるようになるのでしょうか?

よろしくお願い致します。

Aベストアンサー

私にも経験がありますが、
HTMLにテーブルなどを使用している場合に
タグの閉じ忘れをしているとブラウザでは
反映されるのに
DWのデザインビューには反映されない事があります。

DWのコードビューでテーブル系のタグを追っていって
閉じ忘れ箇所を修正すれば直ると思いますよ。

Q文字の位置、上下のマージンがずれる

仕事でHTML+CSSでコーディングをされる方、
または精通されている方に質問です。

pタグで2行の段落を続けて配置してみました。
IE6・7、FF、Chrome、Safariではぴったりレイアウトが合うのですが、
IE8・9で確認すると誤差が生じます↓

<p>あああああ</p>
<p>かかかかか</p>

★pに対する指定
font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","MS Pゴシック","MS PGothic";
font-size: 14px;
line-height: 1;
margin: 0;
padding: 0;

各pタグにわかりやすく背景色をつけて確認してみると・・・

・IE8だと、2段目のテキスト位置が1px上に上がり、pの高さも1px縮む
・IE9だと、1段目と2段目のテキスト位置が1px上に上がり、2段目のpの高さが1px縮む

それぞれのpに高さを決めれば問題はないようですが、
高さを決めずにテキストを配置する場合、
この誤差については対応ができないものなのでしょうか?

pタグに限らず、ul、dlなんかでもずれることが多いです。
テキストをぴったりを合わせる技術ってないのでしょうか?

仕事でHTML+CSSでコーディングをされる方、
または精通されている方に質問です。

pタグで2行の段落を続けて配置してみました。
IE6・7、FF、Chrome、Safariではぴったりレイアウトが合うのですが、
IE8・9で確認すると誤差が生じます↓

<p>あああああ</p>
<p>かかかかか</p>

★pに対する指定
font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","MS Pゴシック","MS PGothic";
font-size: 14px;
line-height: 1;
margin: 0;
padding: 0;

各pタグにわかりやすく背景色をつけて確認して...続きを読む

Aベストアンサー

まず、line-height:20pxのように、line-heightをpxで指定してみてください。
ブラウザの違いによる縦の誤差はなくなるはずです。

誤差が生じる原因としてはOSやブラウザの違いから、フォントやレンダリングの違いによるものです。
なので、font-size:14px;に指定していても、line-heightをemや%で相対的に指定している場合は、必ず誤差が生じます。

なお、文字列の横をそろえるのほぼ無理と考えてください。

>pタグに限らず、ul、dlなんかでもずれることが多いです。

こちらに関しては、ブラウザ間のデフォルトの差異をなくすため、リセットCSSがよく使われます。
リセットCSS、reset cssなどで検索してみれば色々出てくるでしょう。
最近はHTML5を考慮しているものもたくさんあるので、そちらを使った方が良いでしょう。
しかし、これも完全に誤差をなくせるというわけではありませんが、一度試してみると良いでしょう。

Q【DreamWeaver】「コード」画面の文字を大きくしたい

ドリームウィーバー8(Win)使用者です。
HTMLを表示する「コード」画面の文字が小さくて目が疲れるため、もう少し大きくならないかと考えています。
DreamWeaverの機能としてなんとかなりませんでしょうか?
お詳しい方、よろしくお願いいたします。

Aベストアンサー

「編集」「環境設定」「フォント」を選択。
「コードビュー」「サイズ」を16ptを選択。

QDreamweaver デザインビューの表示が変

DreamweaverCS4を使っていますが、デザインビューに、テーブルの一番上のセルに張った画像しか表示されません。
ブラウザでプレビューすると綺麗に全体が表示されるのですが、デザインビューで編集がまったくできない状態なので困っています。

表示→ライブビューをクリックすると、デザインビューにも綺麗に表示されますが、編集は効かない状態です。

以下がhtmlのコードです。
まだ作成途中ですが、この段階でもデザインビューには文字すら出てきません。
無知な質問で申し訳ありませんが、どなたかご教授よろしくお願いします。


<!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" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="content-script-type" content="text/javascript">
<meta name="keywords" content="aaa">
<meta name="description" content="aaaaaa" />
<title>あいうえおかきくけこ</title>
<link href="style/common.css" media="all" rel="stylesheet" title="CSS" type="text/css" />
</head>
<body>
<div id="pageBody">
<table width="700" border="0" align="center">
<tr>
<td><center>
<img src="style/top_image_a.png" />
</center></td>
</tr>
<table width="700" border="0" align="center" cellspacing="0">
<tr>
<td bgcolor="#97E1A3">このサイトは?</td>
</tr>
<tr>
<td bgcolor="#E8FECF">あいうえお</td>
</tr>
</table>
<table class="table001">
<tr>
<td width="130" rowspan="2"><img src="style/Btn_info_a.bmp" /></td>
<td width="570"><h2>このサイトのごあんない</h2></td>
</tr>
<tr>
<td valign="top"><p>このサイトの説明です。</p></td>
</tr>
</table>
</table>
</div>
</body>
</html>

DreamweaverCS4を使っていますが、デザインビューに、テーブルの一番上のセルに張った画像しか表示されません。
ブラウザでプレビューすると綺麗に全体が表示されるのですが、デザインビューで編集がまったくできない状態なので困っています。

表示→ライブビューをクリックすると、デザインビューにも綺麗に表示されますが、編集は効かない状態です。

以下がhtmlのコードです。
まだ作成途中ですが、この段階でもデザインビューには文字すら出てきません。
無知な質問で申し訳ありませんが、どなたかご教授よろ...続きを読む

Aベストアンサー

table直下にtableは置けません。
そこを治せばデザインビューでも見れると思います。(2つ目のtableの前を閉じる。最後の/tableを1つ取る)
文法間違いのチェックなら、採点ツールが便利です。
http://cetus.sakura.ne.jp/htmllint/htmllint.html

大きなお世話ですが、
無知でこれから勉強するなら、勉強方法?、教本・お手本のたぐいの見直しをされたほうがいいですよ。今から物理レイアウトタグやテーブルレイアウトを学ぶのはかなりの遠回りになります。html+cssでレイアウトはcssに任せる事をお勧めします。

具体的には
「align="center"/<center>タグ/bgcolor」を使わない。
今回の質問ではtableは1つも使わない。

見た目の為のタグやtableは使わない。見た目はスタイルシートに任せましょうという、web標準や文章構造と見た目(デザイン)の分離に触れている教科書で学びなおしをされることをお勧めします。

Qテーブル内の文字サイズを変更したい。

HTMLのテーブル内の文字サイズを変更したいのですが。
イマイチ上手くいかずに悩んでいます。
出来れば全体的に<TABLE></TABLE>のほうでいじれますか?
<TD>タグや<TR>タグのところでいじくるのですか?

Aベストアンサー

いろいろやり方はありますが
文字単位でサイズを変更するには
#2の方法ですね。

テーブルごとやセル(<TD>)ごとにサイズを変更するには
スタイルシート(CSS)を使用します。

テーブルごとにサイズを変更する場合
<TABLE style="font-size : 20px;">

セル(<TD>)ごとにサイズを変更する場合
<TD style="font-size : 20px;">あああ</TD>

#1の方法だとページ内の全てのセル(<TD>)に設定することになります。

スタイルシート(CSS)はこれら以外にも
いろいろな設定方法があります。

Qテーブルの表示がずれます

htmlを書いているのですが、テーブルの行を増やすたびに、ブラウザで表示するとテーブルの表示がだんだん下の方へずれてしまいます。友人に聞いたところ、彼も同じような現象が起こるようです。
このようにならないようにしたいのですが、専門書を読んでも分かりません。
ちなみにhtmlソースはこのようになっております。
(1)行が1つの場合
<html>
<head>
<title>テスト</title>
</head>
<body bgcolor = "white">

<h1>テスト</h1>
<h3>テスト1</h3>
<table>
  <tr>
   <td>テスト</td>
   <td>1</td>
   <td>2</td>
  </tr>
</table>
</body>
</html>

(2)行が2つの場合
<html>
<head>
<title>テスト</title>
</head>
<body bgcolor = "white">

<h1>テスト</h1>
<h3>テスト2</h3>
<table>
  <tr>
   <td>テスト</td>
   <td>1</td>
   <td>2</td>
  </tr>
<tr>
   <td>テスト</td>
   <td>1</td>
   <td>2</td>
  </tr>
</table>
</body>
</html>
宜しくお願い致します。

htmlを書いているのですが、テーブルの行を増やすたびに、ブラウザで表示するとテーブルの表示がだんだん下の方へずれてしまいます。友人に聞いたところ、彼も同じような現象が起こるようです。
このようにならないようにしたいのですが、専門書を読んでも分かりません。
ちなみにhtmlソースはこのようになっております。
(1)行が1つの場合
<html>
<head>
<title>テスト</title>
</head>
<body bgcolor = "white">

<h1>テスト</h1>
<h3>テスト1</h3>
<table>
  <tr>
   <td>テスト</td>...続きを読む

Aベストアンサー

こんにちは。
イマイチどうしたいのかがよく判らないので、具体的な説明を補足してください。
ソース自体は間違いではないと思いますが…。
<tr>や<td>の前にある空白はもちろん半角空白ですよね?全角だと不具合がでます。

行が増えると下に表が大きくなるのは必然ですし。
行が1行のものと、2行のものとでは、ページが違うんですよね?
もし、同じページに表示するのであれば、1ページにつき、<html>タグは一組です。(あくまでも基本的に、ですが)
これが、直接行がずれるっていうことにはならないと思いますけど…。

QCSSでborderの長さを指定、または可変にしたい。

下記のように指定していますが、これだと横幅いっぱいに下の線が表示されてしまいます。

文字なりの長さ、または指定のピクセル数にしたいのですが、どのようにしたらよいでしょうか。

h3{
border-width : 0px 0px 1px 5px;
border-style : solid ;
border-color : #FF3333;
padding-left : 5px;
}

Aベストアンサー

borderの長さはそのボックスの大きさですから、ボックスの大きさを指定する事になります。
h3{
width:???px;
border-width : 0px 0px 1px 5px;
border-style : solid ;
border-color : #FF3333;
padding-left : 5px;
}

また、文字数(ボックスの内容)に合わせたい場合は、ボックスを浮動化(float)する等の方法もありますが・・・そのボックスの周りへ影響が出たり、ブラウザ毎にバグや実装の違いなどが比較的多く、扱いが面倒になるのであまりおすすめできません。

HTMLの方も修正する方法でもよければ

<h3><span>××○○</span></h3>
のようにspanで囲い、スタイルをspanに対して指定する方法もあります。

h3 span{
border-width : 0px 0px 1px 5px;
border-style : solid ;
border-color : #FF3333;
padding-left : 5px;
}

borderの長さはそのボックスの大きさですから、ボックスの大きさを指定する事になります。
h3{
width:???px;
border-width : 0px 0px 1px 5px;
border-style : solid ;
border-color : #FF3333;
padding-left : 5px;
}

また、文字数(ボックスの内容)に合わせたい場合は、ボックスを浮動化(float)する等の方法もありますが・・・そのボックスの周りへ影響が出たり、ブラウザ毎にバグや実装の違いなどが比較的多く、扱いが面倒になるのであまりおすすめできません。

HTMLの方も修正する方法でもよけ...続きを読む

Q【緊急】FTPエラーが発生してしまいアップロード出来ません

こんにちは。仕事の合間に失礼します。

HPのアップロードを行なったのですが、アップロードが出来ないファイルがあります。他は全て出来たのですが…。
何度もPUTを繰り返しているのですが、同じ結果になります。
ちなみにDrameWeaver8のFTPでアップしています。

以下、エラーメッセージです。
『ファイル操作が不完全です。1個のファイルまたはフォルダが完了しませんでした。
【詳細】
○○.html - エラー発生 - FTP エラー が発生しました。 -
○○.html を PUT できません。 アクセスが拒否されました。ファイルが存在しないか、権限の問題が考えられます。
ファイル操作が不完全です。1 個のファイルまたはフォルダが完了しませんでした。
エラーのあったファイル :1』

タグの関係なのでしょうか?
それともFFFTPを使った方がよいのでしょうか…。
どうすればよいか分からないでいます。教えてください…。

Aベストアンサー

同名のファイルがアップロード先にありませんか?

○○.htmlでアップロードできないのであれば○○.htmや○○.txtでアップロードしてサーバー上で拡張子を変える、という手もありますよ

Qposition:relative で Dreamweaver の表示が崩れる

webブラウザでの表示は問題が無いのに、
Dreamweaverで見ると、表示が崩れます。。

ごく普通のブログデザインで、
#container の中に
#main,#sub,#bottomがあり、
#main,#subのみfloat:leftを指定する段組み。
#bottomにはclear:leftが指定してあります。

この#bottomに、position:relativeを指定した途端に、
dwで見ると、#main,#subに続いて右に回り込んでしまうのです。
ちなみにposition指定をしたのは#bottomが最初の要素で、
試しに#containerにもposition指定してみたのですが、
状況は変わりません。

これを、Macのfirefox、safari、IE5.2…でチェックすると、
どのブラウザでも正常に表示されます。
崩れるのはdwのみ。。

とても気持ちが悪いです。
思い当たる状況、ないでしょうか?

よろしくお願いします!

Aベストアンサー

Mac MX2004ではANo.1の回答に書かれたソースで
[main(青][sub(黄]
[ 赤 ]
[bottom(緑]
このように表示されます。

CSSスタイルインスペクタとタグインスペクタを使ってposition:relativeを入れたり消したりしても、
デザインビューの表示は変わりませんでした。

ファイルを一度閉じて、開き直してみるとか、OSごと再起動してみてはいかがでしょうか。
(あ、日にちが経ってるのでもうされてますよね(^^;)

もしくは、
#bottomにfloat:leftや、
#container {
width:780px;
}
などのwidthを別の数字に変えるような指定がどこかに入ってませんか?

同じファイルの別の場所や別のファイルで#bottom{float:left}と書かれていれば、それも適用されます。
必要ならfloat:none;で上書きしてみて下さい。


> …作業的には、デザイン表示モードでの確認がほぼ無意味でちとツライのですた^^;
もともとDreamweaverはテーブルレイアウト+スタイルシートで個々のパーツのデザイン、というスタイルを取っているので、
スタイルシートでレイアウトしようとすると、結構崩れますね。
私もあきらめてます。
おそらくCS3(2007年7月現在の最新バージョン)で良くなっていると思いますが、
それ以外のバージョンではどうしようもないと思います。

Mac MX2004ではANo.1の回答に書かれたソースで
[main(青][sub(黄]
[ 赤 ]
[bottom(緑]
このように表示されます。

CSSスタイルインスペクタとタグインスペクタを使ってposition:relativeを入れたり消したりしても、
デザインビューの表示は変わりませんでした。

ファイルを一度閉じて、開き直してみるとか、OSごと再起動してみてはいかがでしょうか。
(あ、日にちが経ってるのでもうされてますよね(^^;)

もしくは、
#bottomにfloat:leftや、
#container {
width:780px;
}
など...続きを読む

Q  これの意味教えて下さい。

これの意味教えて下さい。
タグの
<tr>
<td></td>
</tr>
中に入っている
意味はなんですか?

Aベストアンサー

空白(半角スペース)として使用されることが多いですが、
を使用すると改行されません。

たとえばOK WaveのOKが行末あたりに来たときに、
(1)OKとWaveの間を半角スペースとする場合
~~~OK<改行>
Wave~~~

となりますが、
(2)OKとWaveの間をとする場合
~~~<改行>
OK Wave~~~

となります。


人気Q&Aランキング