0

写真用のウェブページのデザインが完成しました。テストブラウザとして Chrome を使用しました。

しかし、IEで自分のページを開いたところ、何も表示されませんでした。いくつかのトラブルの後、問題をパーセンテージを使用しているという事実に切り分けました。解決策をオンラインで検索しましたが、すべてがマイナーなバリエーション (パディングとパーセンテージに関連) に関するものです。

以下は、Chrome では完全に機能する単純な HTML ファイルですが、IE ではすべてが機能するわけではありません (div はピクセルのないボックスで、テキストの存在によってわずかに拡張されています)。よろしくお願いいたします。この問題を解決できない場合は、サイトを完全に再設計する必要があります。

<html>
<head>
    <title>A test HTML</title>
    <style type="text/css">
        #currpage
        {
            position: absolute;
            bottom: 18%;
            right: 10%;
            left: 35%;
            top: 15%;
            border:2px solid green;
            z-index: 240;
        }
    </style>
</head>
<body>
    <div id="currpage" style="visibility: visible; opacity: 1;">
        This is just a test.
    </div>
</body>
</html>
4

3 に答える 3

4

実際に整形式の HTML ファイルを作成してみましたか?

がないDOCTYPE場合、ブラウザーはページを Quirks モードでレンダリングします。IE の場合、IE5.5 の場合と同じようにレンダリングされますが、IE5.5 は現在の基本機能の多くをサポートしていません。

ファイルの先頭に追加<!DOCTYPE HTML>します。

編集：あなたがそれをしている間、常にContent-Type<meta>タグ<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />を含めてください（ブラウザがエンコーディングが何であるかを知るためなど。また<meta http-equiv="X-UA-Compatible" content="IE=edge" />、IEに最も厳格な標準モードを使用させるために追加することも検討してください。これらはすべてのものに表示されますDOCTYPE と Content-Type は必須で (実際に機能させたい場合)、Compatible ヘッダーはオプションです (私は主に、煩わしく閉じる互換モード ボタンを取り除くために使用します)。 [更新] ボタンに...)

于 2012-05-15T19:43:39.020 に答える
0

私は Mac を使用しているので確認できませんが、HTML に Doctype がないようです。IE はコードを解析する方法を知らないため、問題が発生している可能性があります。

最初の行 ( <html>-Tag の前でも) に次のように記述します。

<!DOCTYPE html>

これは HTML5 ドキュメント用です。

編集: ....編集.... その点は忘れてください。

于 2012-05-15T19:45:28.517 に答える
0

包含要素の高さと幅を明示的に設定します。古いページの 1 つで同様の問題が発生し (Firefox と Chrome では正常に動作し、IE では地獄に落ちました)、その Firefox と Chrome では、明示的に割り当てられていない場合、含まれる要素のサイズが自動的に設定されることがわかりました。そして、それらのパーセンテージはそれらの仮定に基づいています。IE はそのような仮定を行わないため、パーセンテージを見ると、基本的に「何の 35% か?」と表示されます。

于 2012-05-15T20:13:18.347 に答える