Dreamweaver8で表を作成しましたが、助けてください

質問

今晩は。
　Dreamweaver8でHPを作成していますが、全くの初心者です。
　今回表を作成しましたが、良く分かりません。困っています。どなたか是非宜しくお願い致します。
　本当は絵が表示できればもっと分かりやすかったのですが、絵のコピペができませのでコードを貼り付けましたので宜しくお願い致します。

1.地図のセル内の縦の位置が中央に来ないで上寄りになったり下寄りになったりしています、これはどのようにして修正するのですか。
2.地図を書いているセル内に点線が表示されます、これは何を意味しているのでしょうか。
またこれを消すことは出来るのでしょうか。
3．連絡先の枠を左右に広げ、地図の枠を狭くしたいのですがどのようにしたら良いのですか
現在４００（７２４）と表の枠の広さが表示されていますが、400と724をどのように操作すれば枠の広さが自由に変えられるようになるのですか。
4.表の個々の枠線の色は自由に変えられるのですか。

<table width="400" height="301" border="2" cellpadding="0" cellspacing="0" bordercolor="#FF00FF">
<col width="72" span="10">
<tr height="39">
<td colspan="10" height="39">(支店、営業所のご案内)</td>
</tr>
<tr height="29">
<td colspan="10" height="29">★東&nbsp; 京支店&nbsp; 東京都★▲☆区◎◇☆　　　　　　（営業時間　9：00～17：00）&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
</tr>
<tr height="23">
<td height="38" colspan="9" nowrap>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; （連絡先：◎▽◇－◎▽◇◎－▽◇◎▽）</td>
<td align="right"><div align="right">地&nbsp; 図</div> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
</tr>
<tr height="29">
<td colspan="10" height="29">★名古屋支店　愛知県名古屋市☆★▲区◎◇☆　　（営業時間　9：00～17：00）</td>
</tr>
<tr height="24">
<td colspan="9" height="40">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; （連絡先：◎▽◇－◎▽◇◎－▽◇◎▽）</td>
<td height="50" align="right"><div align="right">地&nbsp; 図</div></td>
</tr>
<tr height="27">
<td colspan="10" height="27">★九州営業所　福岡県福岡市★▲区◎◇◇◇☆　　（営業時間　9：00～17：00）</td>
</tr>
<tr height="24">
<td colspan="9" height="24">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; （連絡先：◎▽◇－◎▽◇◎－▽◇◎▽）</td>
<td align="right">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<div align="right">地&nbsp; 図</div></td>
</tr>

回答No.2

noname#56851 · ベストアンサー

デザインやテキストの位置決めはスタイルシートで決める方がすっきりします。
特に半角スペースでの位置あわせはHTMLファイルを読みにくいものにすると思います。
http://msugai.fc2web.com/web/CSS/border.html
一度覗いてみてください。

回答No.3

thila

1.空白(&nbsp;)が上下に入っているせいで上下にずれているのが原因と思われます。
　一旦全て削除されてみてはいかがでしょうか。

2.DreamWeaverの編集画面でのみ表示される、div要素の範囲を示すものです。
　divを消せば消えますが、ブラウザでは見えないので必要以上に気にしなくても良いものです。
　※今回の場合はtdとdivで同じ指定を重ねてしているので、消してしまって問題ないと思います。

3.400(724)の400は今現在設定している値で、(724)が実際に表示されるときのおおよそのサイズです。
　地図の画像が大きすぎるか、&nbsp;が原因かで幅の変更がきかなくなっている感じがします。
　まずはテーブルの中身をすっきりさせて、適切な値を与えてから調整をしてみて下さい。

4.CSSを使えば可能です。
例)
《CSS部分》
<style type="text/css">
<!--
.midashi {
border-style: double;
border-width: 3px;
border-color: #99CC33;
}
.naiyou {
border-style: dashed;
border-width: 1px;
border-color: #0000FF;
}
-->
</style>

《テーブル部分》
<table width="350" border="0">
<tr>
<td width="100" class="midashi">○○</td>
<td width="250" class="naiyou">ああああ</td>
</tr>
<tr>
<td class="midashi">▲▲</td>
<td class="naiyou">いいいいいいい</td>
</tr>
</table>

CSSの設定に関しては参考URL先の「枠線」部分をご覧下さい。

DW等のソフトはあくまでHTML作成支援ソフトです。
微調整をしたい時やおかしくなったところを修正する際には、コードを直接漁ったほうが原因を見つけやすいので、HTMLのことも少しずつ覚えていかれると、より便利にソフトを使いこなせると思います。

参考URL：

http://www.tagindex.com/stylesheet/box/index.html

回答No.1

goalmania

ええっと、何から言っていいのかわからないので下記のソースを参考にならないかもですが。。参考にして下さい。

<table width="400" border="0" cellspacing="0" cellpadding="0">
<tr>
<td bgcolor="#FF00FF"><table width="400" border="0" cellspacing="2" cellpadding="0">
<tr bgcolor="#FFFFFF">
<td height="40" colspan="2">(支店、営業所のご案内)</td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="40" colspan="2">★東京支店 東京都★▲☆区◎◇☆（営業時間　9：00～17：00）</td>
</tr>
<tr bgcolor="#FFFFFF">
<td width="280" height="40">連絡先：◎▽◇－◎▽◇◎－▽◇◎▽）</td>
<td width="114" height="40" align="right">地 図</td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="40" colspan="2">★名古屋支店 愛知県名古屋市☆★▲区◎◇☆（営業時間　9：00～17：00）</td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="40">（連絡先：◎▽◇－◎▽◇◎－▽◇◎▽）</td>
<td height="40" align="right">地 図</td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="40" colspan="2">★九州営業所 福岡県福岡市★▲区◎◇◇◇☆（営業時間　9：00～17：00）</td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="40">（連絡先：◎▽◇－◎▽◇◎－▽◇◎▽）</td>
<td height="40" align="right">地 図</td>
</tr>
</table></td>
</tr>
</table>

1.地図のセル内の縦の位置が中央に来ないで上寄りになったり下寄りになったりしています、これはどのようにして修正するのですか。

【回答】上のソースでいうと<td height="40">のところに<td height="40" valign="top">とすると上揃えです。"top"の値を"center"（中央揃え）、"bottom"（下揃え）となります。

2.地図を書いているセル内に点線が表示されます、これは何を意味しているのでしょうか。またこれを消すことは出来るのでしょうか。

【回答】確認できませんでした。。CSSで書かれているのかもしれません。

3．連絡先の枠を左右に広げ、地図の枠を狭くしたいのですがどのようにしたら良いのですか
現在４００（７２４）と表の枠の広さが表示されていますが、400と724をどのように操作すれば枠の広さが自由に変えられるようになるのですか。

【回答】これはおそらくですがソースがごちゃごちゃになっていたので変更がきかなかったんだと思います。上のソースの<tr bgcolor="#FFFFFF"><td width="280" height="40">連絡先：◎▽◇－◎▽◇◎－▽◇◎▽）</td><td width="114" height="40" align="right">地 図</td></tr>のwidth="280"、width="114"を変更してください。
※半端な数値になっているのは全体の400pxの中に枠線の太さも含まれるからです。

4.表の個々の枠線の色は自由に変えられるのですか。

【回答】えっと、それは難しいです。できるのかな？

結論を言うとソースが少し汚いです。。
colspan="9"とかよくわからないところに大きな数字が入ってしまったり、 を乱用してしまったりしているので、テーブルを一から作り直す方が早いと思いますよ。頑張ってください。わかりにくかったらもう一度、質問してくださいねー。