2012-01-05 6 views
0

最近まで、私たちのアプリはdoctypeを指定していませんでした。その後、ブラウザの互換性を高めるため、厳密なdoctypeを追加しました。これにより、さまざまなブラウザ間ですべての動作がより似ていました。しかし、IE9では、これによって要素の見た目がどのように変化するかがわかりました。それが起こっている唯一のものだったことを確認するために、私は次のようにHTMLページを作っ:Doctypeに基づいてIEでHTMLの外観が異なるのはなぜですか?

<html> 
<select> 
    <option>Testing</option> 
</select> 
</html> 

このHTMLはIE9で、次のようにレンダリングされます:

no doc type

その後、私はちょうど追加しますDOCTYPEは次のように:

HTMLは、このようにレンダリング
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
<select> 
    <option>Testing</option> 
</select> 
</html> 

with doc type

いくつかの微妙な違いがありますが、私にとって最も大きなものは、下向きの矢印があるドロップダウンの部分です。 1つは白い背景を持ち、もう1つはグレーです。選択肢のスタイルを変更するCSS標準がありますか?私たちはそれをどのように使用して表示していきたいのですが、可能かどうかは分かりません。

FireFoxで同じテストを行い、doctypeと厳密なdoctype表示の両方に、下向き矢印の白い背景が表示されました。 Chromeの同じテストでは、両方とも灰色の背景で行っています。

これを制御する方法はありますか?これに関する情報は非常に高く評価されます。ありがとう。

答えて

1

これは、ページにネイティブOS要素を混合する不幸な副作用です。私の経験では、要素を完全に再スタイルすることが最善の方法です。あなたがサポートしているブラウザーとブラウザが古くなるほど、これらはすべて微妙な違いがあります。これらの要素のスタイリングを始めるには、いくつかのページがあります。 DOCTYPEの

http://ryanfait.com/resources/custom-checkboxes-and-radio-buttons/

http://bavotasan.com/2011/style-select-box-using-only-css/

0

欠如は、あなたがなりたいことはありませんquirks modeにあなたを置きます。 Doctypeは、標準モードにするために、すべての最新のWebページに必要です。 quirksモードでは、適切なボックスモデルは、特にIEによって追跡されず、あらゆる種類の奇妙なことが起こる可能性があります。これは、常にすべてのWebページに置かれるべきdoctypeです。一度それが設定されると、決してそれを変更することはありません。

関連する問題