1

IE: http: //666kb.com/i/c6fufhslm58tzh66k.jpg Chrome: http: //666kb.com/i/c6fufwh0ebfrcgwi4.jpg

phpコード:

echo"<div id='anamain'>";
echo"<iframe frameborder=0 scrolling=yes width=100% height=100% src='duello.php'></iframe>";
echo"</div>";

cssコード:

#anamain
{
    position:absolute;
    background-color:#f2f2f2;
    left:25%;
    top:205px;
    border-width:1px;
    width:50%;
    height:auto;
    color:#9db4bd;
}

この違いの問題をどのように解決できますか?Chromeビューの方法が欲しいです。

4

1 に答える 1

3

各ブラウザには、ページ要素のデフォルト状態がわずかに異なります。通常、これらの違いを軽減するために「CSSリセット」を使用します。

詳細については、http://www.cssreset.com/をチェックしてください。

そうは言っても、すべての違いがリセットされたスタイルシートによって対処されるわけではありません。一部の要素は、ブラウザによって動作が異なるだけです。特に、Internet Explorerと呼ばれる、マニアックで子供を食べる逸脱者を扱っている場合はなおさらです。

これを理解すると、目的に応じて、cssoverflowプロパティを使用してスクロールバーを強制できます。

#anamain
{
    /* ... previous styles ... */
    overflow: scroll;
    /* OR overflow: hidden; to hide */
    /* OR overflow-y: scroll; */
    /* OR overflow-x: scroll; */
}

overflow問題に固有のことですが、実際には、含まれているdivではなく、スタイルをiframeに適用する必要があるようです。サンプルをまとめました:

http://jsfiddle.net/WqJYG/

ご覧のとおりoverflow: hidden;、ラッピングdivとiframeの両方にスタイルを適用すると、スクロールバーが表示されなくなります。

ドキュメンテーション

于 2012-08-16T18:35:58.910 に答える