2012-06-30 9 views
5

Rozważmy scenariusz, w którym atrybut CSS brakuje jednostkę (px, em, pt,%):awaryjna dla atrybutów CSS bez jednostki

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

pytania:

  1. Dlaczego to awaryjne do px? Czy piksel jest zawsze preferowaną jednostką? Czy istnieje jakaś zasada zdefiniowana w roboczym projekcie lub zaleceniu W3C?
  2. Czy istnieje reguła, która nakłada na UA obowiązek powrotu do preferowanej jednostki?
  3. Biorąc pod uwagę powyższy przykład, które z następujących jest prawidłowe zachowanie:
    • Internet Explorer: w trybie osobliwości (IE6,5,4 ..) szerokości i granica szerokości stosowane awaryjnej do pikseli. Od IE7 (do dziś, IE10RP) ignoruje całą regułę, jeśli brakuje jednostki. Dlatego obie zasady zostały zignorowane.
    • Firefox 13: W powyższym przykładzie szerokość ma postać zastępczą px, ale szerokość krawędzi została zignorowana.
    • Chrome 19, Opera 12, Safari 5.1.2: Zarówno szerokość, jak i szerokość ramki zastępują px.

Uwaga: W Microsoft Connect, mówili:

Kwestia zgłaszasz jest zgodne z projektem. IE10 w trybie standardowym ignoruje szerokość lub wysokość bez jednostki zgodnie ze standardami CSS. Urządzenie nie jest opcjonalne.

Odpowiedz

13

Nie widzę deklaracji doctype w kodzie HTML, więc mogę tylko założyć, że strona testowa jest renderowana w trybie dziwactwa.

  1. Dlaczego to awaryjne do px? Czy piksel jest zawsze preferowaną jednostką? Czy istnieje jakaś zasada zdefiniowana w roboczym projekcie lub zaleceniu W3C?

    Zostanie przywrócony tylko do px w trybie dziwactwa (i wierzę tylko w niektóre właściwości). I tak, px jest preferowaną jednostką zastępczą. Jest to nawiązaniem do starszych atrybutów HTML width i height, które akceptowały długości pikseli jako liczby bez jednostek.

  2. Czy istnieje reguła, która zobowiązuje UA do powrotu do preferowanej jednostki?

    Nie, stąd niespójne zachowanie, które obserwujesz. W trybie standardów UA musi ignorować wartości długości bez jednostek; urządzenie nie jest opcjonalne, jak wspomniano w witrynie Microsoft Connect, którą cytujesz.

    In CSS2.1, wszystkie niezerowe długości muszą mieć jednostki.

  3. Biorąc pod uwagę powyższy przykład, które z następujących jest prawidłowe zachowanie:

    • Internet Explorer: w trybie osobliwości (IE6,5,4 ..) szerokości i granica szerokości stosowane awaryjnej do px. Od IE7 (do dziś, IE10RP) ignoruje całą regułę, jeśli brakuje jednostki. Dlatego obie zasady zostały zignorowane.
    • Firefox 13: W powyższym przykładzie szerokość ma postać zastępczą px, ale szerokość krawędzi została zignorowana.
    • Chrome 19, Opera 12, Safari 5.1.2: Zarówno szerokość, jak i szerokość ramki zastępują px.

    Ponownie, opiera się na założeniu, że strona jest w trybie quirks, mogę tylko powiedzieć, że podczas gdy specyfikacje uczynić wzmiankę o dziwnych zachowaniach, konkretne szczegóły takiego ekscentryczne zachowania nie są zdefiniowane w specyfikacje (zarówno z oczywistych, jak i nieoczywistych powodów).

    Zgaduję Microsoft zmienił zachowanie dziwactwa trybu w IE7 + odzwierciedla standardy zachowania wartości niemianowana, jak istnieje tryb dziwactw w wszystkich przeglądarkach (z wyjątkiem IE < 6) i jest uruchamiany z tego samego nieprawidłowego doctype lub braku z doctype. Zachowanie w trybie standardów nie uległo jednak zmianie, o ile wiem.

+2

To jest poprawna odpowiedź. Kiedy użyłem doctype HTML5 '', wszystkie wyżej wymienione przeglądarki ignorują szerokość i obramowanie. Nigdy nie wiedziałem, że inne przeglądarki również zachowują się inaczej w trybie dziwactwa. Dziękuję Ci! –

0
    „px”
  1. jest najczęstszą jednostka używana, więc ogólnie przeglądarki używają tam „zdrowego rozsądku” i użyj „px”, jak to jest najczęściej używane urządzenie w projektach internetowych, jeżeli jednostka nie jest określona.
  2. Nie ma takiej reguły. Przeglądarki używają najczęściej używanego urządzenia w projektach.
  3. Idealnym zachowaniem powinno być używanie px i poruszanie się bez ignorowania innych stylów, ale nie ma takiej reguły, więc gdy widzisz różne przeglądarki różne rzeczy, które faktycznie implementują tam własną logikę, aby przeciwdziałać takim błędom, nie ma jednej reguły śledzić w takich scenariuszach. To zależy od przeglądarki, co robi.

Nigdy nie należy polegać na przeglądarce, aby poprawić swój błąd. Zawsze polegaj na sobie dla lepszej KOMPATYBILNOŚCI PRZEGLĄDARKI

+0

Problem był spowodowany brakiem typu dokumentu. –

Powiązane problemy