Html 获取IE8有条件的样式表，使响应式web设计能够正常工作_Html_Css_Internet Explorer 8_Responsive Design

Html 获取IE8有条件的样式表，使响应式web设计能够正常工作

html css internet-explorer-8 responsive-design

Html 获取IE8有条件的样式表，使响应式web设计能够正常工作,html,css,internet-explorer-8,responsive-design,Html,Css,Internet Explorer 8,Responsive Design,我已经创建了一个移动第一响应网页。它在我喜欢的所有主要浏览器中都运行良好，在手机和平板电脑上也很不错最后一部分是我希望它在IE8中看起来像样我在这里读到了#3（），您可以简单地使用条件注释为IE9和更低版本的桌面版本样式提供特定的样式表我用我的桌面风格创建了ie.css，并在标题部分添加了这个有条件的评论，但是运气不好，我仍然在IE8和更低版本中获得了移动风格 <!DOCTYPE html> <html lang="en"> <head> <met

我已经创建了一个移动第一响应网页。它在我喜欢的所有主要浏览器中都运行良好，在手机和平板电脑上也很不错

最后一部分是我希望它在IE8中看起来像样

我在这里读到了#3（），您可以简单地使用条件注释为IE9和更低版本的桌面版本样式提供特定的样式表

我用我的桌面风格创建了ie.css，并在标题部分添加了这个有条件的评论，但是运气不好，我仍然在IE8和更低版本中获得了移动风格

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />

<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<link rel="shortcut icon" href="favicon.ico">

<title>Page Title</title>

<link rel="stylesheet" href="style.css" media="all">

<!--[if (lt IE 9)&(!IEMobile)]>
<link rel="stylesheet" href="ie.css" media="all">
<![endif]-->

<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
  <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

</head>


页面标题

有什么问题吗？我仔细检查了ie.css文件是否位于index.html旁边的目录中，就像style.css一样。是否有其他原因导致这不起作用？

谢谢，

希望它能帮助您，添加一些jQuery以在ie8以下版本中加载网页时删除响应样式表，因此为ie8及以下版本添加新样式表

if (jQuery.browser.version >= 8.0) {
    $('link[rel=stylesheet][href~="style.css"]').remove();
}

或者，如果您需要响应1.e8 0r 7，请确保已在下面添加这些元标记和脚本

<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
 <!--[if lt IE 9]>
  <script src="js/html5shiv.js"></script>
  <script src="js/respond.min.js"></script>
 <![endif]-->

使用-javascript polyfill使css媒体查询在IE8中工作

您的移动样式表中可能有一些样式，但在您的IE工作表中没有贴花。因此，它们不会被覆盖。您可以在非IE样式表上排除移动样式表

<!--[if !(IE)]><!--> <link rel="stylesheet" href="style.css" media="all"> <!--<![endif]-->
<!--[if (lt IE 9)&(!IEMobile)]><link rel="stylesheet" href="ie.css" media="all"><![endif]-->

如果我读对了，你只想瞄准ie8？
首先，将html5shiv置于所有样式表之上……除非您的样式表实际上没有ie的样式。html5shiv需要首先呈现，以便它可以告诉ie这些是元素，并且需要相应地对它们进行样式设置。
我仍然不清楚您到底想要什么，也不确定您的目标是否低于ie8，所以让我们修复ie8问题：


编辑

我们所做的就是将html5shim移到所有样式表之上。然后是其他浏览器的样式表。然后是仅适用于ie8的样式表。然后是少于ie 8而不是ie mobile的样式表。
请注意：我将版本从小于9更改为小于8，因此不可能相互交叉引用、取消/添加样式。
再说一遍，我不清楚这是你想要的，但这解决了我看到的问题。如果我误解了什么，请不要犹豫。

EDIT：看起来mobile not（

if！IEMobile

）需要不同的语法，所以我假设尝试将它们分开可以解决这个问题。参考资料如下：

您是否检查了页面以查看css文件是否正确加载？@BrianGlaz我如何在IE inspector中查看css文件是否正确加载？当我检查并查看head部分时，我没有看到加载ie.css文件的条件注释。我假设它应该在那里，但没有看到它。好吧，我已经学会了如何使用F12 Inspector网络选项卡来查看页面正在加载的资源（）它似乎没有加载ie.css文件。但是为什么呢？它与style.cssThanks位于同一位置，但我已添加了行“”，如上所示，但仍然无效。我已将其用于另一个项目，但是否有必要？这是一个非常简单的页面，它只显示内容。大多数人都会通过移动设备看到它，所以我讨厌只为IE8加载js库。没有什么是必要的，所以不是真的。你似乎已经愿意为IE加载额外的文件了。我喜欢使用它，因为它允许我现有的媒体查询也适用于IE，而不需要使用额外的css文件。无论哪种方式，它都是一个额外的静态资源。我想，如果它只为IE8或更低版本加载它，那么本质上加载额外文件的想法是相同的。我要试一试。仍然不确定为什么它没有加载我的ie.css文件。我尝试添加respond.JS（），但出于某种原因，它似乎也没有加载这些资源。我的条件评论有什么问题吗？不是我想要的那样，但是这个方法似乎对我有效（）我的页面（）我已经尝试了你在这里建议的方法（），但是我仍然在IE8.huh中获得了移动风格。我现在正在寻找@mobile cc。看看我能找到什么我想你需要一个不同的语法。我编辑了answerHooray，它现在正在引入ie.css！它看起来有点混乱，但我可以调整的风格，现在我可以看到他们。它似乎没有引入ie8.css，但也许我不需要它？谢谢js是一个更快的修复程序，但我很高兴知道没有它我也可以用另一种方式来修复。idk为什么ie8不工作。可能是轻微的语法错误。


<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
  <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

<link rel="stylesheet" href="style.css" media="all">

<!--[if IE 8]>
  <link rel="stylesheet" type="text/css" href="ie8.css" />
<![endif]-->

EDIT
<!--[if lt IE 8]>
<link rel="stylesheet" href="ie.css" media="all">
<![endif]-->  
<![if !IEMobile]>   
<link rel="stylesheet" href="ie.css" media="all">
<![endif]>