tableとdiv設定height:100%無効な完璧な解決方法

2613 ワード

html ブラウザ css XHTML Dreamweaver

ページのレイアウトに触れたばかりの初心者は、tableやdivの高height=「100%」を設定しても無効、CSSを使ってheight:「100%」を設定しても無効、なぜそうなるのでしょうか.height:100%を解決するのは無効で、tableとdivの解決方法は同じではありません.
まずtableについてお話ししますが、Dreamweaverを使ってページを作成したり、新しいページを作成したりすると、通常はコードの頭に以下のようなコードがあります:http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">間違いなく、当ててみて、問題はここにあります.この短いコードを削除してから、ページをリフレッシュしてみると、すべてのtableがあなたの設定height=「100%」で展示されています.このコードは、ブラウザにあなたのページがどのような基準に従っているかを教えてくれます.上の「W 3 C」の基準のように、削除するのは一般的に影響しません.次にdivについてお話しします.divはtableと同じようにwidth:100%を実現するのは簡単ですが、divのheight:“100%”を要求すると、あまり言うことを聞かなくなります.実は言うことを聞かないのではなく、言うことを聞かせる方法を知らないのです.以下のコード:http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/1999/xhtml">テスト

としてもTableとしても同じように頭の部分を取り除いても100%表示できません.理由は簡単です.divのheight=“100%”にして、Webページを実行させると、cssが先に実行され、Webページ全体の内容がまだ完全にロードされていないため、divの外のなどの高さは取得できないので、height=“100%”も望み通りに表示できません.body{height:100%}を加えると簡単に解決できます.最初からbodyを100%表示させます.彼の部下divは自然と100%ですが、FFブラウザではHTMLもheight:100%、つまりhtml、body{height:100%}を先に与えるべきです.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> New Document </title>
  <style type="text/css">
    html { height: 100%}
    body {height:100%;margin:0px;padding:0px}
    table{height: 100%;width: 100%;}
  </style>
 </head>

 <body>
    <table border=1>
        <tr>
            <td>
                <ul>
                    <li>12
                    <li>34
                </ul>
            </td>
            <td>
                <iframe name="" src="" width="100%" height="100%"></iframe>
            </td>
        </tr>
    </table>
 </body>
</html>

本文はCSDNブログから来て、転載して出典を明記してください:http://blog.csdn.net/majin_com/archive/2011/04/12/6318499.aspx

Pinyin 4 jの詳細と使用

h 5 pdfファイル取得プレビュー