まず第一に、この効果は古いトピックであるべきであることがわかっています。
今日ファイルを整理するとき、以前のレイアウトソリューションのいくつかが長い間フォルダーに横たわっていることがわかりました。古いものを見てみましょう。
CSSPlayの古いエンジニアとウェブマスターがこの効果を達成したのを見て幸運であり、非常に早い段階で与えられたに違いないことに注意する必要があります。
ゴシップが少なく、ソースコードを追加します:
IE6-Layoutの奇妙な機能、CSS実装をトリガーして利用します。
<style type = text/css>
.ie6-out {
_Margin-Left:900px;
_Zoom:1;
}
.ie6-in {
_ポジション:相対;
_float:左;
_Margin-Left:-900px;
}
#min-width {
最小幅:900px;
背景:#ccc;
ラインハイト:200px;
_Zoom:1;
}
</style>
<div class = ie6-out>
<div class = ie6-in>
<div id = min-width> ie6-では、コンテナはmin幅効果のシミュレーションを実現します。ブラウザのウィンドウサイズを自由に変更し、ボタンをクリックして幅を表示します。 </div>
</div>
</div>
CSS実装デモンストレーション:
コードボックスを実行します
[ctrl aすべての選択のヒント:最初にコードを変更してから実行することができます]
拡張デモ:
コードボックスを実行します
[ctrl aすべての選択のヒント:最初にコードを変更してから実行することができます]
CSS発現
- この方法を使用してコンテナの最小幅を達成するときに、多くの人々が不可解なクラッシュに悩まされることが多く、しばしば実を結ばれると信じています。
ここで指摘する必要がある2つのポイントがあります。
1. IE6-のビューポートを表す要素は、標準モードとQuirkモードで異なります。前者は<html>で、後者は<body>です。
2。IE6上記の2つの異なるモードでは、コンテンツがオーバーフローするときの異なる症状が発生し、割り当て判断にデッドループが生じます。説明するのは少し冗長です。自分で練習しましょう。
CSS式は最小幅ソースコードを実装します:<スタイルタイプ=テキスト/css>
body {Text-align:center;}
#min-width {
最小幅:900px;
_width:expression((document.documentelement.clientwidth || document.body.clientwidth)<900?900px :);
ラインハイト:200px;
背景:#ccc;
}
</style>
<div id = min-width> ie6-では、コンテナはmin幅効果のシミュレーションを実現します。ブラウザのウィンドウサイズを自由に変更し、ボタンをクリックして幅を表示します。 </div>
デモ:
コードボックスを実行します
[ctrl aすべての選択のヒント:最初にコードを変更してから実行することができます]
上記の2つのソリューションは、IE6標準モードとQuirkモードの両方で実装できます。 IE式では、このアプリケーションでCPU効率の問題は見つかりませんでした。