- ベストアンサー
ホームページビルダー７
ホームページビルダー７で、表のセルで右クリック→スタイルの設定でクラスを作って表のセルの↓に点線を入れています。 編集画面ではちゃんと点線が出ていますが、時々プレビュー画面にすると点線が一部分消えます。 これはどうしてなのですか？ セルに色を付けたりするのと点線を入れるのは順番はまちまちでやっているのですが、関係あるのでしょうか？ ソースを貼っておきます。 <TR> <TD class="sitatensen" bgcolor="#d7ffd7"></TD> <TD align="center" background="../sozai/dlsozai/1kbnosozaiyasan/aicon75.gif" class="sitatensen" bgcolor="#ffffc8">晴れ</TD> <TD class="sitatensen" bgcolor="#ffffc8">にほんばれ</TD> </TR> 一番右のセルの下線が出ていません。 <TR> <TD rowspan="2" bgcolor="#d7ffd7" class="sitatensen">64/77</TD> <TD bgcolor="#ffffc8" background="../sozai/dlsozai/1kbnosozaiyasan/aicon75.gif"><IMG src="../sozai/hidarimukiyazirusi_blue.gif" width="300" height="50" border="0"></TD> <TD bgcolor="#ffffc8">とっしん</TD> </TR> <TR> <TD bgcolor="#ffffc8" background="../sozai/dlsozai/1kbnosozaiyasan/aicon75.gif" class="sitatensen"></TD> <TD bgcolor="#ffffc8" class="sitatensen">反動</TD> </TR> 真ん中のセルの一番下に点線を入れましたが出てきません。 分かる方がいらっしゃいましたらよろしくお願いします。
- hikapo
- お礼率80% (17/21)
- ホームページ作成ソフト
- 回答数2
- ありがとう数2
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
空欄のセルのため、設定が見えていないのだと思います。セルに全角空白などを入れればよいと思います。例↓ <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta http-equiv="Content-Style-Type" content="text/css"> <title></title> <style type="text/css"> <!-- .sitatensen{ border-bottom-style : dashed; border-bottom-color : purple; } --> </style> </head> <body> <table> <TR> <TD class="sitatensen" bgcolor="#d7ffd7"> </TD> <TD align="center" background="../sozai/dlsozai/1kbnosozaiyasan/aicon75.gif" class="sitatensen" bgcolor="#ffffc8">晴れ</TD> <TD class="sitatensen" bgcolor="#ffffc8">にほんばれ</TD> </TR> <TR> <TD rowspan="2" bgcolor="#d7ffd7" class="sitatensen">64/77</TD> <TD bgcolor="#ffffc8" background="../sozai/dlsozai/1kbnosozaiyasan/aicon75.gif"> <IMG src="../sozai/hidarimukiyazirusi_blue.gif" width="300" height="50" border="0"></TD> <TD class="sitatensen" bgcolor="#ffffc8">とっしん</TD> </TR> <TR> <TD class="sitatensen" bgcolor="#ffffc8" background="../sozai/dlsozai/1kbnosozaiyasan/aicon75.gif"> </TD> <TD bgcolor="#ffffc8" class="sitatensen">反動</TD> </TR> </table> </body> </html>
その他の回答 (1)
- hirumin
- ベストアンサー率29% (705/2376)
プレビューで見える物と、ブラウザで見た時の見え方が違うという事を過去に経験していましたが、どのようなことだったか忘れてしまいました。 プレビューでの確認ではなく、保存してインターネットエクスプローラーなどで実際に表示させた物を信用したほうがいいですよ。
お礼
回答ありがとうございます。 いえ、プレビューだけではなくアップしたあともおかしくなっているんです。 インターネットエクスプローラーでやっていますが、ブラウザ変えたらちゃんと表示されますかね？
関連するQ&A
- ホームページの表の作成について２…
前回、『ホームページの表の作成について…』という質問をしました。 そして、 <table bgcolor="#000000" cellspacing="1" background="http://radiowind.web.fc2.com/backgroundtable"> <tr> <td bgcolor="#ffffff">あいうえお</td><td bgcolor="#ffffff">かきくけこ</td> </tr> <tr> <td bgcolor="#ffffff">さしすせそ</td><td bgcolor="#ffffff">たちつてと</td> </tr> </table> にしました。 でも、表の背景が表示されません。 どこが間違っているんでしょうか？
- ベストアンサー
- その他（インターネット・Webサービス）
- ホームページビルダーで右端のセルが狭くなります。
ホームページビルダーで右端のセルが狭くなります。 現在ホームページビルダーの教科書を見ながら勉強しているのですが、教科書が用意しているファイルをビルダーで開くと右端のセルだけが狭くなります。 ちなみにブラウザ（IE）で開くと問題ありません。 これは何が原因でしょうか？編集しにくいので教えてください。 ちなみにソースは以下の感じです。（BODY以下） 念のため画像も添付します。 <BODY text=#000000 vLink=#808080 aLink=#ff8040 link=#ff3535 bgColor=#333333> <CENTER> <TABLE cellPadding=3 width=650 bgColor=#ffffff> <COLGROUP> <COL> <COL width=220> <TBODY> <TR> <TD vAlign=top rowSpan=11><IMG height="400" alt="代替テキスト１" src="xxx.gif" width="120" border="0"></TD> <TD colSpan=2><IMG height="150" alt="代替テキスト２" src="xxx.jpg" width="520" border="0"></TD></TR> <TR> <TD colSpan=2> <UL> <LI></LI> </UL> </TD></TR> <TR> <TD colSpan=2><IMG alt="代替テキスト" src="iｘｘｘ.gif" border="0"></TD></TR> <TR> <TD><IMG height="180" alt="代替テキスト" src="ｘｘｘｘ.jpg" width="140" border="0"></TD> <TD vAlign=top><FONT size=-1>長いテキスト文<BR><BR>このページの先頭へ</FONT></TD></TR> <TR> <TD colSpan=2></TD></TR> <TR> <TD></TD> <TD vAlign=top></TD></TR> <TR> <TD colSpan=2></TD></TR> <TR> <TD></TD> <TD vAlign=top></TD></TR> <TR> <TD colSpan=2></TD></TR> <TR> <TD></TD> <TD vAlign=top></TD></TR> <TR> <TD align="center" colSpan=2></TD></TR></TBODY></TABLE></CENTER></BODY></HTML> ちなみにCOLGROUPとCOLの使い方もよくわかりません。 よろしくお願い致します。
- ベストアンサー
- ホームページ作成ソフト
- ＨＰビルダー6.5でのテーブルが変
こういう画面をテーブルで作りたいのですが、どうしても変になります。 ┌─┐┌─┐┌─┐ │画││画││画│ │ │└─┘│ │ │ │┌─┐│ │ │ ││ ││ │ │ │└─┘│ │ │ │┌─┐│ │ │像││画││像│ └─┘└─┘└─┘ 周りを画像で囲み、真ん中を開けてそこに字を打ち込みたいと思っています。 周りの画像は自分で切った１枚のもので、表示後にはまた１枚の画像に見えるようにしたいのですが、画像と画像の隙間がどうしても埋まらず、背景の色が線になって画像の合体を邪魔します。 上下の小さな画像は引き延ばしたりしているのですが、何が原因なのか教えて頂けませんか？ちなみにそのタグを下にペーストします。 <TABLE> <TBODY> <TR> <TD rowspan="3"><IMG src="＊＊＊.gif"></TD> <TD height="26"><IMG src="＊＊＊.gif"></TD> <TD rowspan="3"><IMG src="＊＊＊.gif"></TD> </TR> <TR> <TD height="242" bgcolor="#ffffff"></TD> </TR> <TR> <TD height="170"><IMG src="＊＊＊.gif"></TD> </TR> </TBODY> </TABLE>
- ベストアンサー
- HTML
- このテーブルタグの中の色を白にするには
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE></TITLE> <STYLE type="text/css"> <!-- .border{ font-size : 1pt; } --> </STYLE> </HEAD> <BODY> <TABLE border="0" cellpadding="0" cellspacing="0"> <TBODY> <TR> <TD colspan="2" rowspan="2"><IMG src="images/001_base_1.gif" width="20" height="20" border="0"></TD> <TD height="2" bgcolor="#000000"><SPAN class="border">o</SPAN></TD> <TD colspan="2" rowspan="2"><IMG src="images/001_base_2.gif" width="20" height="20" border="0"></TD> </TR> <TR> <TD height="18"></TD> </TR> <TR> <TD width="2" bgcolor="#000000"><BR> </TD> <TD width="18"></TD> <TD>ここに内容を書きます（画像<A href="images/001_base_1.gif">１</A>・<A href="images/001_base_2.gif">２</A>・<A href="images/001_base_3.gif">３</A>・<A href="images/001_base_4.gif">４</A>）</TD> <TD width="18"></TD> <TD width="2" bgcolor="#000000"><BR> </TD> </TR> <TR> <TD colspan="2" rowspan="2"><IMG src="images/001_base_4.gif" width="20" height="20" border="0"></TD> <TD height="18"></TD> <TD rowspan="2" colspan="2"><IMG src="images/001_base_3.gif" width="20" height="20" border="0"></TD> </TR> <TR> <TD height="2" bgcolor="#000000"><SPAN class="border">o</SPAN></TD> </TR> </TBODY> </TABLE> </BODY> </HTML> 現在はテーブルの内側の色が透明色（背景の色）になっています。 これを透明でなく白にする方法をおしえてください！
- 締切済み
- HTML
- 表の幅・高さ１００％表示が、ブラウザによっては見え方が違う事ついて
初めまして。お世話になります。 現在、ホームページを作成していますが、 分からない事がありますので、質問させて頂きました。 ホームページビルダーで、表（tableタグ）を使ったレイアウトを作成中です。 表の幅（width）と高さ（height）を共に１００％で指定し、 表の中をセル（td）で細かく仕切り、その中に画像やテキストを配置し、 レイアウトしたいと思っています。 表のサンプルソースはこんな感じです。細かくてすみません…。 <TABLE border="0" cellpadding="0" cellspacing="0" width="100%" height="100%"> <TR> <TD height="20" colspan="5"></TD> </TR> <TR> <TD height="1" bgcolor="#cccccc" colspan="5"></TD> </TR> <TR> <TD height="30" colspan="5"></TD> </TR> <TR> <TD height="1" bgcolor="#cccccc" colspan="5"></TD> </TR> <TR> <TD colspan="5" height="5"></TD> </TR> <TR> <TD rowspan="3"></TD> <TD rowspan="3" bgcolor="#0000ff" width="1"></TD> <TD height="1" width="700" bgcolor="#0000ff"></TD> <TD rowspan="3" bgcolor="#0000ff" width="1"></TD> <TD rowspan="3"></TD> </TR> <TR> <TD width="700"></TD> </TR> <TR> <TD width="700" height="1" bgcolor="#0000ff"></TD> </TR> </TABLE> 上記のソースでは表の中に、幅７００pｘの青色の四角いスペースを作っています。 しかし、ブラウザで見え方を確認しますと。 InternetExplorer、Opera、Sleipnirではうまく表示できますが、 Firefox、Lunascapeではうまく表示できません。 高さは大丈夫なのですが、 <TD height="1" width="700" bgcolor="#0000ff"></TD> <TD width="700"></TD> <TD width="700" height="1" bgcolor="#0000ff"></TD>等の、 width="700"が無視され、青色の四角いスペースまでもが、１００％表示になってしまいます。 どのようなタグを書けば、どのブラウザでも正しく表示できるようになるのでしょうか？ また、Firefox、Lunascapeのバージョンが古いのですが、 これらの影響もあるのでしょうか？ Firefoxがバージョン1.5.0.2で、Lunascapeがバージョン3.5.4です。 よろしくお願いいたします。
- ベストアンサー
- HTML
- bgcolorとbackground-color
タグ打ちで、bgcolorとbackground-colorは一緒ですか？？ 一緒として話しを進めます。 <table> <tr><td bgcolor="#e1e1e1"></td></tr> <tr><td bgcolor="#d1d1d1"></td></tr> </table> なら、セルの色を変更出来ましたが、 <table> <tr><td background-color="#e1e1e1"></td></tr> <tr><td background-color="#d1d1d1"></td></tr> </table> だと、セルの色を変更できません。 なぜですか？？ bgcolorとbackground-colorは違うのですか？？使う場所がそれぞれ決まっているとか？？ 気になってます。教えて下さい。
- ベストアンサー
- ブログ
- HTML <td></td>タグ セル内余白を無くす方法
次の様なプログラムで画像(a.gif 30x30ピクセル)を表示させると、画像とセル枠線との上下の間に余白ができる。この余白を無くす方法？ <table border="1"> <tr><td rowspan="2"><img src="a.gif"></td><td><br></td></tr> <tr><td rowspan="2"><img src="a.gif"></td></tr> <tr><td rowspan="2"><img src="a.gif"></td></tr> <tr><td rowspan="2"><img src="a.gif"></td></tr> <tr><td><br></td><td> </table> テーブル内を２列にして、画像を縦方向に画像高さの半分だけズラして表示したい。 セル結合をしないで、ごく普通に２行２列にすると画像とセル枠との間には余白が生じない。 セル結合した場合に生ずる余白を無くす方法を教えて下さい。エディタは「メモ帖」、ＯＳはWinXP、ブラウザはInternet Explorer６です。
- ベストアンサー
- ホームページ作成ソフト
- テーブルでのハイライト表示について教えて下さい
皆さんこんばんわ。 いつも利用させてもらっています。 HTMLとJAVA SCRIPTの初心者です。 テーブルでのonmauseoverになっている時のハイライトにする 方法を教えて下さいTT trをハイライトにするという内容の質問はありましたが、 今回は途中で背景色が変わるため、 どうしても作ることができませんでした。 一つ一つIDをふり、onmouseoverでの処理をさせてみましたが、 FirefoxではDOCTYPEの違いからか、エラーが出て表示することが できませんでした。 項目的には残り１００項目ほどありますので、どなたかお教え いただけませんでしょうかTT よろしくお願いします。 以下、ソースです。 <!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" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <head> <script type="text/javascript"> function TDBC0() { //背景を設定 TD1.style.background='#FFFFCC'; TD1.style.background='#FFFFCC'; TD2.style.background='#FFFFCC'; TD3.style.background='#FFFFCC'; TD4.style.background='#FFFFCC'; TD5.style.background='#FFFFCC'; TD6.style.background='#FFFFCC'; TD7.style.background='#FFFFCC'; } function TDBC0C() { //背景を元に戻す TD1.style.background='#f1f1e0'; TD2.style.background='#f1f1e0'; TD3.style.background='#ffffff'; TD4.style.background='#ffffff'; TD5.style.background='#f1f1e0'; TD6.style.background='#fafaf5'; TD7.style.background='#fafaf5'; } //身体測定 体重 function TDBC1() { //背景を設定 TD1.style.background='#FFFFCC'; TD1.style.background='#FFFFCC'; TD2.style.background='#FFFFCC'; TD3.style.background='#FFFFCC'; TD4.style.background='#FFFFCC'; } function TDBC1C() { //背景を元に戻す TD1.style.background='#f1f1e0'; TD2.style.background='#f1f1e0'; TD3.style.background='#ffffff'; TD4.style.background='#ffffff'; } //身体測定 体重 function TDBC2() { //背景を設定 TD1.style.background='#FFFFCC'; TD1.style.background='#FFFFCC'; TD5.style.background='#FFFFCC'; TD6.style.background='#FFFFCC'; TD7.style.background='#FFFFCC'; } function TDBC2C() { //背景を元に戻す TD1.style.background='#f1f1e0'; TD5.style.background='#f1f1e0'; TD6.style.background='#fafaf5'; TD7.style.background='#fafaf5'; } </script> <head> <body> <table border="1" cellpadding="0" cellspacing="0" class="tbl004"> <tr> <th rowspan="2" bgcolor="#C4E5FA" class="bg1">分 類</th> <th rowspan="2" bgcolor="#C4E5FA" class="bg1">種類</th> <th colspan="2" bgcolor="#C4E5FA" class="bg1">在庫数</th> </tr> <tr> <th bgcolor="#C4E5FA" class="bg1">下 限</th> <th bgcolor="#C4E5FA" class="bg1">上 限</th> </tr> <tr> <th rowspan="2" bgcolor="#f1f1e0" class="tdBgcolor02" id="TD1" onmouseover="TDBC0()" onmouseout="TDBC0C()">書籍</th> <td bgcolor="#f1f1e0" class="tdBgcolor02" id="TD2" onmouseover="TDBC1()" onmouseout="TDBC1C()">単行本</td> <td bgcolor="#ffffff" id="TD3" onmouseover="TDBC1()" onmouseout="TDBC1C()">50</td> <td bgcolor="#ffffff" id="TD4" onmouseover="TDBC1()" onmouseout="TDBC1C()">270</td> </tr> <tr> <td bgcolor="#f1f1e0" id="TD5" onmouseover="TDBC2()" onmouseout="TDBC2C()" class="tdBgcolor02">文庫本</td> <td bgcolor="#cccccc" id="TD6" onmouseover="TDBC2()" onmouseout="TDBC2C()" class="tdBgcolor03">10</td> <td bgcolor="#cccccc" id="TD7" onmouseover="TDBC2()" onmouseout="TDBC2C()" class="tdBgcolor03">300</td> </tr> </table> </body> </html>
- ベストアンサー
- JavaScript
- セルの高さを固定するには？
2列2行のテーブルを作り、右の列をrowspan=2で結合しています。 右の列はテキストや画像を追加入力していくので、縦が長くなっていきます。 その際、左上のセルだけ高さを固定し、左下のセルは自動で高さが決まるようにしたいと思っています。 が、左上のセルにheight=150と入力しても、右が伸びるにつれて長くなってしまいます。 CSSで指定しても同じです。 rowspanを使うと、結合していないセルの高さを固定することはできないのでしょうか。 良い解決策がありましたら、お知恵をお貸し下さい。 <table> <tr> <td>ここを固定したいです</td> <td rowspan="2">ここが長くなっていきます</td> </tr> <tr> <td>ここは右が長くなるにつれて自動で伸びるようにしたいです</td> </tr> </table>
- ベストアンサー
- HTML
- tdの中のbackgroundを繰り返しにしたくない
webページをテーブルで組んだとき、1つだけのtd内にbackgroundを設定しているのですが、縦や横に長くなったときに、同じ画像が繰り返し表示されます。そこで、どのようにして繰り返しをなくせばいいのでしょうか？因みに、 <table> <tr> <td colspan="2" align="center"> <img src="aaa.gif"></td> </tr> <tr> <td rowspan="2" background="bbb.jpg"> </td> <td align="center"> <img src="ccc.gif"></td> </tr> <tr> <td align="center"> <img src="ddd.gif"></td> </tr> </table> 上記HTMLで、bbb.gifにあたります。 どなたかご存知な方は教えてください。お願いします。
- ベストアンサー
- HTML
お礼
ありがとうございます。 空白を入れたらちゃんと表示されました。