Mam kilka napisanych CSS, które sprawiają, że moja strona docelowa jest mobilna, a następnie używam CSS Media Queries, aby załadować kolejny arkusz stylów dla przeglądarek komputerowych. Robię to, ponieważ istnieje tak wiele przeglądarek mobilnych, które nie rozumieją zapytań o media CSS, i jest bardziej prawdopodobne, że użytkownicy komputerów stacjonarnych mają nowoczesne przeglądarki, które obsługują to.Warunkowe arkusze CSS nie załadowane przez IE7 i IE8
Mam następujące CSS, który działa we wszystkich nowoczesnych przeglądarkach (IE9, Chrome, Firefox 3.6+, Safari 4 + 5):
I wtedy zrozumiałem, że IE7 i IE8 nie obsługują zapytań o media CSS, tak więc powyżej nie zadziała. Więc dodałem warunkową deklarację, aby go załadować:
<link rel="Stylesheet" type="text/css" href="/css/mobile.css" media="all"/>
<!-- [if lt IE 9]>
<link rel="Stylesheet" type="text/css" href="/css/desktop.css" media="all" />
<! [endif] -->
<link rel="Stylesheet" type="text/css" href="/css/desktop.css" media="only screen and (min-width: 640px)" />
Jednakże, używając IE Tester i Browsershots, mam potwierdził, że desktop.css
nie ładuje się w IE 7 i 8. Wydaje się być całkowicie ignorując tego arkusza stylów.
Potem próbowałem zmienić instrukcję warunkową na <!-- [if IE 8]>
, ale to nie miało żadnego efektu.
Wreszcie usunąłem całkowicie warunku oświadczenie, w wyniku tego kodu:
<link rel="Stylesheet" type="text/css" href="/css/mobile.css" media="all"/>
<link rel="Stylesheet" type="text/css" href="/css/desktop.css" media="all" />
To ostatnie wyniki próba w moim desktop.css ładowany w IE7 i IE8. To dowodzi, że CSS jest w porządku. Wygląda na to, że moje warunkowe oświadczenie nie jest wyzwalane.
Jakieś pomysły, co robię źle?
Nie jestem pewien, czy to jest problem, ale spróbuj usunąć spacje. '' -> '' – Shaz