我有一个asp.net-mvc3网站。 我使用css创建了所有布局。布局正是我想要它在firefox和Chrome上的方式,但在Internet Explorer上却是一团糟。
所以现在我想解决它。
但问题是我想修复它而不会在firefox或chrome上搞乱它。
我是否必须从头开始重建并重建布局?或者有没有办法为特定浏览器指定某个布局。
这样的事情:
如果Internet Explorer然后使用此css表或样式,则使用我已经拥有的内容。
答案 0 :(得分:6)
使用这些(把它放在头上):
定位IE的所有版本
<!--[if IE]>
<link rel="stylesheet" type="text/css" href="all-ie-only.css" />
<![endif]-->
除IE之外的一切目标
<!--[if !IE]><!-->
<link rel="stylesheet" type="text/css" href="not-ie.css" />
<!--<![endif]-->
仅限目标IE 7
<!--[if IE 7]>
<link rel="stylesheet" type="text/css" href="ie7.css">
<![endif]-->
仅限目标IE 6
<!--[if IE 6]>
<link rel="stylesheet" type="text/css" href="ie6.css" />
<![endif]-->
仅限目标IE 5
<!--[if IE 5]>
<link rel="stylesheet" type="text/css" href="ie5.css" />
<![endif]-->
仅限目标IE 5.5
<!--[if IE 5.5000]>
<link rel="stylesheet" type="text/css" href="ie55.css" />
<![endif]-->
目标IE 6和LOWER
<!--[if lt IE 7]>
<link rel="stylesheet" type="text/css" href="ie6-and-down.css" />
<![endif]-->
<!--[if lte IE 6]>
<link rel="stylesheet" type="text/css" href="ie6-and-down.css" />
<![endif]-->
目标IE 7和LOWER
<!--[if lt IE 8]>
<link rel="stylesheet" type="text/css" href="ie7-and-down.css" />
<![endif]-->
<!--[if lte IE 7]>
<link rel="stylesheet" type="text/css" href="ie7-and-down.css" />
<![endif]-->
目标IE 8和LOWER
<!--[if lt IE 9]>
<link rel="stylesheet" type="text/css" href="ie8-and-down.css" />
<![endif]-->
<!--[if lte IE 8]>
<link rel="stylesheet" type="text/css" href="ie8-and-down.css" />
<![endif]-->
目标IE 6和更高
<!--[if gt IE 5.5]>
<link rel="stylesheet" type="text/css" href="ie6-and-up.css" />
<![endif]-->
<!--[if gte IE 6]>
<link rel="stylesheet" type="text/css" href="ie6-and-up.css" />
<![endif]-->
目标IE 7和更高
<!--[if gt IE 6]>
<link rel="stylesheet" type="text/css" href="ie7-and-up.css" />
<![endif]-->
<!--[if gte IE 7]>
<link rel="stylesheet" type="text/css" href="ie7-and-up.css" />
<![endif]-->
目标IE 8和更高
<!--[if gt IE 7]>
<link rel="stylesheet" type="text/css" href="ie8-and-up.css" />
<![endif]-->
<!--[if gte IE 8]>
<link rel="stylesheet" type="text/css" href="ie8-and-up.css" />
<![endif]-->
答案 1 :(得分:1)
您需要条件IE样式表。
创建您只希望IE使用的样式表,并将它们放在IE特定代码中的文档头中。例如:
<!--[if IE]>
<link rel="stylesheet" type="text/css" href="all-ie-only.css" />
<![endif]-->
这将在任何版本的IE上调用all-ie-only.css样式表,但您可以将代码更改为特定版本,甚至是一组版本,例如“少于IE9”
这是一个很棒的资源,包含所有信息 - http://css-tricks.com/how-to-create-an-ie-only-stylesheet/(Dan已在此答案中复制并粘贴了确切的内容)
答案 2 :(得分:1)
您必须确定问题(这可能与使用Quirks模式有关)并解决它们。
没有一个解决所有IE问题的神奇子弹,提供完全不同的样式表通常需要做更多的工作。
您可以使用conditional comments专门为IE提供代码,但在绝大多数情况下,应该轻轻一点。
答案 3 :(得分:1)
通过使用完整的reset.css样式表,我成功地在IE,Safari,Opera和Firefox中获得了非常一致的设计。
reset.css将“删除”每个浏览器的不同预设标准,然后将您的实际样式表加载到干净的平板上。
只有在测试了reset.css和stylesheet-name.css后才能创建特定于浏览器的黑客攻击。这是跨多个浏览器进行一致显示的最佳实践。
以下链接就是一个很好的例子:http://meyerweb.com/eric/tools/css/reset/
答案 4 :(得分:0)
您要求的是<!--[if IE]>
标记。这个website详细介绍了它。
但是,将来您可以构建一个跨平台工作的站点,而无需使用If IE标记。这一切都取决于你的CSS和标记。