cssスタイルのいくつかの互換性ie 9の問題

1416 ワード

以下は、ブロガー自身がプロジェクトを書くときに遭遇したieと互換性のあるcssスタイルに関する問題です.
グラデーション
ie 9以下ではgradientはサポートされていません.グラデーションを使用するには、safriaブラウザには適用されず、fffは略記できません.
 FILTER: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#ffffff', endColorstr='#018ee8');

GradientTypeの値は0と1です.0は縦を表す.1は横を表す
ie 9でこのプロパティを使用すると、radiusが無効になり、親要素にradiusとoverflow:hidenを設定して効果が得られます.
selectドロップダウンデフォルトスタイルクリア
ie 10およびie 11では、selectのデフォルトのドロップダウン三角を隠すには、次の行のコードを使用します.
select ::-ms-expand{display:none}

ie 9および以下の方法では機能しません.私は「障壁法」を使用して、pラベルを宣言し、絶対位置決めを使用してドロップダウン三角ボタンを上書きし、pラベルに貫通属性pointer-eventsをクリックします.
p{
    background-color:white;
    pointer-events:none;
    display:inline-block;
}

これでデフォルトスタイルの「クリア」ができ、クリック効果にも影響しませんが、selectが広くなければ文字が上書きされる可能性があります.ドロップダウン三角ボタンを自分で設定する必要がある場合は、背景図で自分で追加できます
flexレイアウト
flexレイアウトはIE 10とIE 11で「時効性」を有し、ラベルがライン内ラベルの場合justify-contentの効果は有効ではありません.この場合、私たちのラベルをライン内ブロックに変換するだけでよいのですが、ie 9以下では適切な方法が見つかりません.
ブロックレベル要素
ie 9がブロックレベルの要素に偏見を持っているように、ie 10で有効になるスタイルはie 9では「爆発」しますが、これらの「爆発」のラベルを行内ブロックに変えるだけで正常になる場合もありますが、失われた位置ずれもあります(許容できるはずです)
imgラベル
ie 9では、自分が書いたページを閲覧すると、画像が自動的に2倍近く伸びて画像が変形することに気づくことがありますが、他のブラウザでは問題ありません.この理由は、画像の高さを設定していないためです.適応高さを選択したためです.画像が固定サイズであれば、画像の高さを直接固定することができます.しかし、画像の幅が不確定であれば、画像の幅を取得して画像の高さを設定することができ、画像が長くなる問題が解決される.