Obsługa IE8 dla CSS Media Query
Czy IE8 nie obsługuje następującego zapytania CSS media:
@import url("desktop.css") screen and (min-width: 768px);
Jeśli nie, jaki jest alternatywny sposób pisania? To samo działa dobrze w Firefoksie.
Jakieś problemy z poniższym kodem?
@import url("desktop.css") screen;
@import url("ipad.css") only screen and (device-width:768px);
11 answers
Wersja Internet Explorera przed IE9 nie obsługuje zapytań o media .
Jeśli szukasz sposobu na poniżanie projektu dla użytkowników IE8, może okazać się pomocne w komentowaniu warunkowym IE. Za pomocą tego można określić arkusz stylów IE 8/7/6, który zapisuje poprzednie reguły.
Na przykład:
<link rel="stylesheet" type="text/css" media="all" href="style.css"/>
<!--[if lt IE 9]>
<link rel="stylesheet" type="text/css" media="all" href="style-ie.css"/>
<![endif]-->
To nie pozwoli na responsywny projekt w IE8, ale może być prostszym i bardziej dostępnym rozwiązaniem niż użycie wtyczki JS.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2015-02-04 10:20:38
Css3-mediaqueries-js jest prawdopodobnie tym, czego szukasz: ten skrypt emuluje zapytania o media. Jednak (ze strony skryptu) "nie działa on na arkuszach stylów @imported (których i tak nie powinieneś używać ze względu na wydajność). Nie będzie też nasłuchiwać atrybutu media elementów <link> i <style>".
W tym samym duchu masz prostsze Odpowiedz.js, który włącza tylko zapytania o media min-width i max-width.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2013-07-08 12:50:48
Najlepsze rozwiązanie jakie znalazłem to odpowiedzJS szczególnie jeśli twoim głównym problemem jest upewnienie się, że Twój responsywny projekt działa w IE8. Jest dość lekki przy 1KB przy min / gzipped i możesz upewnić się, że tylko klienci IE8 go załadują:
<!--[if lt IE 9]>
<script src="respond.min.js"></script>
<![endif]-->
Jest to również zalecana metoda, jeśli używasz bootstrap: http://getbootstrap.com/getting-started/#support-ie8-ie9
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2014-10-17 08:55:17
IE8 (i niższe wersje) i Firefox przed 3.5 nie obsługują zapytań o media. Safari 3.2 częściowo ją obsługuje.
Istnieją pewne obejścia, które używają JavaScript, aby dodać obsługę zapytań o media do tych przeglądarek. Spróbuj tych:
Media Queries wtyczka jQuery (dotyczy tylko szerokości max/min)
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2016-03-29 11:00:22
Wzięte z css3mediaqueries.strona projektu js.
Uwaga: nie działa na arkuszach stylów @ import 'ed(których i tak nie powinieneś używać ze względu na wydajność). Nie będzie też nasłuchiwać atrybutu media elementów <link> i <style>.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2013-09-02 15:32:28
Łatwym sposobem użycia CSS3-mediaqueries-js jest dołączenie następujących elementów przed zamykającym tagiem:
<!-- css3-mediaqueries.js for IE less than 9 -->
<!--[if lt IE 9]>
<script
src="//css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js">
</script>
<![endif]-->
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2014-08-12 14:26:30
Edytowana odpowiedź: IE rozumie tylko ekran i drukowanie jako import nośników. Wszystkie inne CSS dostarczane wraz z instrukcją import powoduje, że IE8 ignoruje instrukcję import. Przeglądarka Geco jak safari czy mozilla nie miała tego problemu.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2013-08-14 20:45:03
Zapytania o Media nie są w ogóle obsługiwane w IE8 i poniżej.
Obejście oparte na Javascript
Aby dodać obsługę IE8, możesz użyć jednego z kilku rozwiązań JS. Na przykład, Odpowiedz można dodać obsługę zapytań o media dla IE8 tylko za pomocą następującego kodu:
<!--[if lt IE 9]>
<script
src="respond.min.js">
</script>
<![endif]-->
CSS Mediaqueries to kolejna biblioteka, która robi to samo. Kod dodawania tej biblioteki do kodu HTML będzie identyczny :
<!--[if lt IE 9]>
<script
src="css3-mediaqueries.js">
</script>
<![endif]-->
Alternatywa
Jeśli nie podoba Ci się rozwiązanie oparte na JS, powinieneś również rozważyć dodanie arkusza stylów tylko dla IE
<!--[if lt IE 9]>
<link rel="stylesheet" type="text/css" media="all" href="style-ielt9.css"/>
<![endif]-->
Uwaga:
Technicznie jest to jeszcze jedna alternatywa: użycie CSS hacks do celu IEWarning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2015-12-07 11:37:21
Przed Internet Explorerem 8 nie było obsługi zapytań o Media. Ale w zależności od przypadku możesz spróbować użyć komentarzy warunkowych, aby kierować tylko Internet Explorer 8 i niższe. Wystarczy użyć odpowiedniej architektury plików CSS.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2013-05-07 14:21:20
Http://blog.keithclark.co.uk/wp-content/uploads/2012/11/ie-media-block-tests.php
Użyłem {[0] } i działa mi dobrze w prawdziwym IE8.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2014-08-18 06:35:24
IE nie dodało obsługi zapytań o media aż do IE9. Więc z IE8 masz pecha.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2011-04-24 14:01:11