インラインフレームが消えてしまいました

締切済

質問者：han_ichi
質問日時：2008/09/13 18:56
回答数：2件

行間を空けようと思い、body内に
<span style="font-size:17px; line-height:20pt;">
を入れたとたん、インラインフレームが表示されなくなってしまいました。

？？と思い<span style="font-size:17px; line-height:20pt;">を消してみてもインラインフレームが戻ってきません。他にやった操作はないはずなのですが・・・（<br>をいくつか削ったりはしました）

インラインフレームのタグもいじっていません。
なにがいけないのか、さっぱり分かりません。inline.htmlもきちんと同じフォルダ内にあります。

私はＨＴＭＬもｃｓｓもとても初心者なので、凄く簡単なところで見落としがあるのかもしれません。
と思って小一時間ほどソースを見直してみたのですが、原因となるものが分からず、困っています。

「こういう状況下ではインラインは使えない」というものでもあるのでしょうか・・・？

一応ソースを貼っておきます。******は単なる文字列だと思ってください。

<html lang="ja">
<head>
<meta http-equiv="content-type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta content="****" name="keywords">
<meta content="**************" name="description">
<meta name="description" content="******************" />
<meta name="keywords" content="*************************" />

<link rel="stylesheet" href="style.css" media="all" type="text/css">
<title>****************</title>
</head>

<body><body background="title.gif">
<span style="font-size:17px; line-height:20pt;">

<h1 id="HEADER"><img src="title.jpg" alt="タイトル画像"></h1>
<br><br><br>

<ul id="NAV">

<li><a href="index.html" title="ホームに戻ります"><img src="home.gif" border=0 alt="ホームに戻ります"></a></li><br><br>

<li><a href="main.html" title="********"><img src="bosyu.gif" border=0 alt="********"></a></li><br><br>

<li><a href="http://*********.com/" title="******"><img src="blog.gif" border=0 alt="管理人のブログです"></a></li><br><br>

<li><a href="douga.html" title="********"><img src="douga.gif" border=0 alt="*****"></a></li><br><br>

<li><a href="http://*********/" title="***********"><img src="bbs.gif" border=0 alt="掲示板"></a></li><br><br>

<li><a href="link.html" title="お世話になっているサイト様です。ネチケットを守ってお伺いして下さい。"><img src="link.gif" border=0 alt="リンク"></a></li>
<br><br>

<li><a href="http://******" title="******"><img src="mail.gif" border=0 alt="メールフォーム"></li></a>
</li>
</ul>

<div id="CONTENT">
<center><b>
<font color=blue>
<br>
*****************<br>
****************<br>

<font color="green><u>****</u><br>
***********<br>
***********</font><br><br>

<iframe src="inline.html" width="50%" height="150" name="koushin">ここはインラインフレームです。表示されない場合はお使いのブラウザが対応しておりませんです。。。</iframe><br><br><br>

<h1><font color=red>**********</h1><br>
********<br>
********

<br>
<a href=*****.html target="_blank"><br><br>
<font size=5>****</font><br></a>
******<br>
******
</font><br>
*************<br>
*************<br><br>
<font color=#00008B><h1>*******</h1>
*******************<br>
*******************<br><br>
*******************<br>
*******************<br>
*******************<br><br>

************</font>
<br>
<br>
<br>


<center><bottom>
<script language="JavaScript" type="text/javascript" src="http://counter1.fc2.com/counter.php?id=3362754"> … src="http://counter1.fc2.com/counter_img.php?id=33627 …


</div>
</body></html>

どこを見落としていますでしょうか・・・
とてもお手数なのですが、どうぞお力をお貸し下さい。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (2件)

最新から表示
回答順に表示

No.1

回答者： 15mm
回答日時：2008/09/13 21:06

47行目（付近）より

<font color="green><u>****</u><br>
↓修正
<font color="green"><u>****</u><br>

color=""の内容が、次に"が出てくるまで、と解釈されてしまいます。
（green><u>*～<iframe src=　までが）
直接の原因はこれですが、いろいろと修正すべきところが多いようです。
<body>が二つある
<ul>直下に<br>不可。<br>は<li></li>内に入れる
終了タグの欠如・過剰が多い（ブラウザごとに解釈が変わる可能性もある）

とりあえずこれくらいは直しておきましょう。

- 0
- 件

通報する

No.2

回答者： abril
回答日時：2008/09/13 21:32

> を消してみてもインラインフレームが戻ってきません。

他にやった操作はないはずなのですが

何らかの修正を加える前の状態では問題なく表示されていたのであれば、修正箇所を全て元に戻せば再び表示される筈です。そうならないという事は、やはり以前のソースと完全に同じには復元できていないのだと思われます。
※ただし、キャッシュをちゃんとクリアできておらず最新の更新が反映されていない状態が続いているのかも？という可能性もないわけではありません。一度キャッシュをクリアして再度起動しなおして見てもだめでしたか？

ただ…貼り付けたソースが現在の状態だとしたら、かなり問題のある状態です。
そもそも「行間を空けようと思い」追加された「<span style="font-size:17px; line-height:20pt;">」はどの様な要素に対して使用されていますか？ソースを見るとまずこれの閉じタグがどこにも存在していない様ですが、もしかして、<body>内の要素全体をこれで囲って適用させ様と思っていますか？spanタグは子要素インライン要素しか含められません。つまり、<span>～</span>の中にh1・ul・div・pといったブロック要素が入れ子になる事は(X)HTMLの文法では許されていません。
ソースの他の箇所にも同様の間違いが多発しています。
■</li><br>
ulの直接の子要素はliのみです。つまり、</li>の後ろや<li>の前に（親のul以外の）他のタグは存在し得ません。もし、li間の余白を空けたいのであれば、marginやpaddingで調整するのが適切です。
■<h1><font color=red>**********</h1>
fontタグが閉じていません。もし、</h1>以降で閉じているなら、入れ子状態が矛盾していますのでこれもまた文法ミスです。
■<font color=#00008B><h1>*******</h1>
fontタグはブロック要素を子要素に持てません。よって、h1を囲むことは出来ません。
■<center><b>
■<center><bottom>
上記のcenterタグは2カ所共閉じていないようですが、これはコピペのミスでしょうか？
■<meta name="description" content="******************" />
■<meta name="keywords" content="*************************" />
この2カ所だけがXHTMLタイプで閉じられていますが、他のソース部分はそうなっていませんので、おそらく質問者様のDOCTYPEはXHTMLではなくHTMLだと思いますが、そうであればここの「閉じ」は不要です。DOCTYPEが不明ですが反対に、現在のDOCTYPE宣言がXHTMLであるならば、img・brタグ、他のmetaタグについても全て閉じなくてはなりません。

最後になりましたが、そもそものご希望、「行間を空けたい」のはどの部分ですか？もしコンテンツ全体なのであれば、line-heightはbodyに、<div id="CONTENT">内だけならそこに、<ul id="NAV">内だけならそこに、<h1 id="HEADER">内だけならそこに…という様に適切な箇所に指定をして下さい。