div+css_html/css_WEB-ITnose の一般的な問題

1. センタリングの問題
div 内のコンテンツは、ie ではデフォルトで中央に配置されますが、ff ではデフォルトで左揃えになります。
ff コンテンツを中央に配置する方法は、コード margin:auto; を追加することです

2. 高さの問題
div が水平に 2 行配置されており、上記の div は実際のコンテンツの高さ (高さ) を設定します。 div が設定された高さより大きいです (ff では) IE では 2 つの div が重なりますが、IE では、下の div が自動的に上の div のためのスペースを確保します。したがって、レイヤーの重なりを避けるためには、高さを適切に制御する必要があります。そうでない場合は、高さを書き込まずに自動的に調整されるようにすることもできます。
または set: overflow:hidden

3. clear:both;
フッターを例として挙げます。float で制御される n 列レイアウトが使用されている場合、ff で閲覧するとフッターが不正になる可能性があります。 . それは依然として float によって制御されているためです。ページの下部に表示したい場合は、フッター div に「clear:both;」と記述してください。

4. float Ie
#box{
float:left;
width:100px;
margin:0 0 0 100px; //この場合、IE は 200px の距離を生成します
display:inline ; // float を無視します
}

5. 重要な説明: display: block, inline 2 つの要素 display (display)
display: block // インライン要素はブロック要素としてシミュレートできます

常に新しい行で開始します;
高さ、行の高さ、および上下の余白はすべて制御できます。
幅が設定されていない限り、幅はコンテナの 100% に設定されます

、

、

;form>、

、および
• はブロック要素の例です。
  display:inline; //同じ行に配置する効果を実現するには、
  display:inline は要素をインライン要素として表示します。
  他の要素は同じ行にあります。行の高さと上部の合計 下のマージンは変更できません。
  幅はテキストまたは画像の幅であり、変更できません。
  、、、、、、および はインライン要素の例です。
  
  diplay:table; //ff の場合、テーブルの効果をシミュレートします 6. IE と FF の幅と高さに関する問題

  min -width は、最小要素を小さくできないことを指定できる非常に便利な CSS コマンドです。これにより、植字が常に正しいことが保証されます。全体の最小値は 770px、最大幅は 1024px です。つまり、ウィンドウが 770xp より小さい場合、ウィンドウが 1024px より大きい場合、画面は自動的に中央に配置されます。 IE は min- の定義を認識しませんが、実際には通常の幅と高さを min があるかのように扱います。このように、幅と高さだけを使用する場合、この 2 つの値は通常のブラウザでは変更されません。 min-width と min-height だけを使用する場合、IE では幅と高さはまったく設定されません。 。
  CSS は次のように設計されています:
  #container{
  min-width: 600px;
  width:expression(document.body.clientWidth }
  
  最初の min-widthは標準ですが、2 行目の幅には IE でのみ認識される Javascript が使用されているため、HTML ドキュメントの形式が低くなります。実際にはJavaScriptの判断により最小幅を実装しています。
  
  同じ方法を使用して IE の最大幅を実現することもできます:
  #container
  {
  min-width: 600px;
  max-width: 1200px;
  width:expression(document.body.clientWidth 1200? ”1200px” : ”auto”;
  }
  7. FF: ! important をサポート、IE は無視します。 height:26px; ) div を垂直方向に中央揃えにするように FF のスタイルを特別に設定します:vertical-align:middle; 行間隔を DIV 全体と同じ高さに増やします: line-height:200px;欠点は、コンテンツを折り返してはいけないことです。
  カーソル: IE FF ではカーソルの指の形を同時に表示できます。手は IE でのみ使用できます。
  FF: リンクは境界線と背景色を追加する必要があります。改行を避けるために、display: block を設定し、float: left を設定します (メニューバーを参照して、a とメニューバーの高さを設定するのは、高さのずれを避けるためです)。が設定されていない場合は、メニューバーにスペースを挿入できます。FF と IE ではボックス モデルの解釈が一致しないため、2 ピクセルの違いが生じます。
  
  これら 2 つのマージンの順序を逆にしてはなりません。! important 属性は IE では認識されませんが、他のブラウザでは認識されるため、実際には次のように解釈されます。
  
  div css xhtml xml ソース コードの例 [ www.52css.com]
  div{maring:30px;margin:28px}
  
  定義を繰り返すと最後の定義に従って実行されるので、単に margin: XXpx! important;
  
  
  
  と書くことはできません
  

声明：

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。