CSS 媒體查詢和IE8 相容性
Internet Explorer 8 (IE8) 在某些CSS 媒體查詢方面存在限制,尤其是導入語句。
不支援查詢:
@import url("desktop.css") screen and (min-width: 768px);
替代寫法:
為了支援IE8,需要將import 語句分成兩行:
@import url("desktop.css") screen; @media (min-width: 768px) { @import url("desktop.css"); }
程式碼關注點:
在提供的程式碼片段中:
@import url("desktop.css") screen; @import url("ipad.css") only screen and (device-width:768px);
第一個import 語句將覆寫IE8 中的第二個import語句。為了避免這種情況,應該重新組織導入:
@import url("ipad.css") only screen and (device-width:768px); @import url("desktop.css") screen;
解決方案:
為了獲得更好的兼容性,請考慮使用css3-mediaqueries- js 或Respond 等填充工具。 Node.js,它為 IE8 等舊版瀏覽器中的媒體查詢提供支援。
以上是如何使 CSS 媒體查詢在 Internet Explorer 8 中運作?的詳細內容。更多資訊請關注PHP中文網其他相關文章!