14

CSS属性に単位（px、em、pt、％）がないシナリオを考えてみましょう。

<body>
    <div 
        style=  "width:170;
                border:1 dotted PaleGreen;
                background-color:MistyRose">
        The quick brown
    </div>
</body>

質問：

  1. なぜpxにフォールバックするのでしょうか？ピクセルは常に優先単位ですか？W3Cワーキングドラフトまたは推奨事項で定義されているルールはありますか？
  2. UAが優先ユニットにフォールバックすることを必須にするルールはありますか？
  3. 上記の例で、正しい動作は次のうちどれですか。
    • Internet Explorer：Quirksモード（IE6,5,4 ..）で、pxへのフォールバックに使用される幅と境界線の幅。IE7（現在まで、IE10RP）以降、ユニットが欠落している場合、ルール全体が無視されます。したがって、両方のルールは無視されました。
    • Firefox 13：上記の例では、widthはpxにフォールバックしましたが、border-widthは無視されました。
    • Chrome 19、Opera 12、Safari 5.1.2：幅と境界線幅の両方をpxにフォールバックします。

注：Microsoft-Connectでは、次のように述べています。

報告している問題は仕様によるものです。標準モードのIE10は、CSS標準に準拠した単位なしで幅または高さを無視します。ユニットはオプションではありません。

4

2 に答える 2

22

HTMLにDoctype宣言が表示されないため、テストページがクァークズモードでレンダリングされているとしか想定できません。

  1. なぜpxにフォールバックするのでしょうか？ピクセルは常に優先単位ですか？W3Cワーキングドラフトまたは推奨事項で定義されているルールはありますか？

    それはクァークズモードでのみフォールバックしpxます（そして私は特定のプロパティについてのみ信じています）。そして、はい、px推奨されるフォールバックユニットです。これは、ピクセル長を無次元数として受け入れていた従来のHTMLwidthと属性を思い起こさせます。height

  2. UAが優先ユニットにフォールバックすることを必須にするルールはありますか？

    いいえ、したがって、観察する一貫性のない動作。ただし、標準モードでは、UAは単位なしの長さの値を無視する必要があります。あなたが引用しているMicrosoftConnectで述べられているように、ユニットはオプションではありません。

    CSS2.1では、ゼロ以外のすべての長さの値には単位が必要です。

  3. 上記の例で、正しい動作は次のうちどれですか。

    • Internet Explorer：Quirksモード（IE6,5,4 ..）で、pxへのフォールバックに使用される幅と境界線の幅。IE7（現在まで、IE10RP）以降、ユニットが欠落している場合、ルール全体が無視されます。したがって、両方のルールは無視されました。
    • Firefox 13：上記の例では、widthはpxにフォールバックしましたが、border-widthは無視されました。
    • Chrome 19、Opera 12、Safari 5.1.2：幅と境界線幅の両方をpxにフォールバックします。

    繰り返しになりますが、ページがクァークモードにあるという仮定に基づいて、仕様ではクァークズ動作について言及していますが、そのようなクァークズ動作の具体的な詳細は仕様で定義されていません（明白な場合とそうでない場合の両方）。明らかな理由）。

    クァークズモードはすべてのブラウザ（IE <6を除く）に存在し、同じ不適切なDoctypeまたはDoctypeの欠如でトリガーされるため、MicrosoftはIE7+のクァークズモードの動作をユニットレス値の標準の動作を反映するように変更したと思います。ただし、私が知る限り、標準モードでの動作は変更されていません。

于 2012-06-30T15:05:35.660 に答える
0
  1. pxは最も一般的に使用される単位であるため、一般的にブラウザは「常識」を使用pxし、単位が指定されていない場合は Web デザインで最も使用される単位として使用します。
  2. いいえ、そのようなルールはありません。ブラウザーは、デザインで最もよく使用される単位を使用します。
  3. 理想的な動作はpx、他のスタイルを無視せずに使用して先に進むことですが、そのようなルールはないため、さまざまなブラウザーが実際に実装しているさまざまなものを見ると、そのようなエラーに対抗するための独自のロジックがあり、そのようなシナリオで従うべきルールはありません. それが何をするかはブラウザに依存します。

間違いを修正するためにブラウザーに頼るべきではありません。ブラウザ間の互換性を向上させるために、常に自分自身に頼ってください

于 2012-06-30T14:39:51.683 に答える