CSSでさまざまなブラウザに対応したソリューション

1. CSS のいくつかのブラウザは異なるキーワードをサポートしており、ブラウザの互換性のために繰り返し定義できます
! important は FireFox と IE7 で認識できます
* は IE6 と IE7 で認識できます
_ は IE6 で認識できます
*+ ことができます
IE6 と FF の違い:
background:orange; :green;
FF、IE7、IE6 の違い:
background:orange;*background:green ! important;*background:blue; :


2. IE 固有の条件付きコメント
link rel="stylesheet" type="text/css" href=" css.css" />
>

3. いくつかのブラウザによる実際のピクセルの解釈
IE/Opera: オブジェクトの実際の幅 = (マージン左) + 幅 + (マージン右)
Firefox/Mozilla: オブジェクトの実際の幅 = (margin-left) + (border-left-width) + (padding-left ) + width + (padding-right) + (border-right-width) + (margin-right)

4. マウスジェスチャの問題: FireFox のカーソル属性はハンドをサポートしていませんが、ポインタをサポートしており、IE は両方をサポートしているため、FireFox で HTML タグの Style 属性を設定する場合は、すべての位置、幅、高さ、サイズの値が使用されます。 IE もこの書き方に対応しているため、一律に px 単位が付加されます。たとえば、Obj.Style.Height = imgObj.Style.Height + 'px';

6. FireFox は、padding 5px 4px 3px 1px などの短縮されたパディング属性設定を解析できません。padding-top:5px に変更する必要があります。 ;padding-right:4px;padding-bottom:1px0;

7. ul、ol およびその他のリストのインデントを削除する場合は、次のように記述します。 0px; padding:0px; ここで、margin 属性は IE で有効ですが、padding 属性は CSS コントロールの透明度: IE: filter:progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=60); FireFox: 不透明度:0.6;

9。CSS コントロール 角丸: IE: 角丸をサポートしません。

FireFox: -moz-border-radius-topleft:4px; -moz-border-radius-topright:4px;
-moz-border-radius-bottomleft:4px;
-moz-border-radius-bottomright:4px;

10. CSS 二重線バンプボーダー: IE: border: 2 ピクセルのアウトセット;

FireFox:
-moz-border-top -colors: #d4d0c8 ホワイト;
-moz-border-left-colors: #404040 #808080;
-moz-border-bottom-colors:#404040 #808080 ;

11. IE はカーソル スタイル ファイルとスクロール バーのカラー スタイルをカスタマイズするための CSS メソッドcursor:url() をサポートしています

。 12. IE には、Select コントロールが常に最前面に表示され、すべての CSS が Select コントロールで機能しないというバグがあります

13. IE は、画像やテキスト コンテンツを含む、フォーム内のラベル ラベルをサポートしています。FireFox は、画像を含むラベルをサポートしていません。画像をクリックしても、Radio または CheckBox でマークされたラベルは効果を持ちません

14。FireFox の TextArea は、onScroll イベントをサポートしません

15。FireFox は、表示セットのインラインおよびブロックをサポートしません。 Div の margin-left と margin-right を auto にすると、すでに中央に配置されていますが、IE

17 では機能しません。 Body に text-align を設定する場合、Div は margin: auto (主に margin-左マージン - 右マージン) を中央に配置します

18. ハイパーリンクの CSS スタイルは、L-V-H-A の順序で設定するのが最善です。それは

これにより、訪問後の一部のハイパーリンクにホバー スタイルやアクティブなスタイルが適用されなくなることを回避できます

19. IE で自動的に折り返されるように設定し、CSS で word-wrap:break-word を設定します。 FireFox の具体的なコードは以下の通りです:


20. フローティング属性をサブコンテナに追加した後、コンテナは自動的に開くことができません
解決策: ラベルの終了後の次のラベルに CSS clear:both;