CSS条件格式 [英] css conditional formatting

问题描述

我有下面的代码来检查用户是否使用IE7 ...并且它需要超过.web_info样式。如果不是IE7，它使用默认样式，如果它不是IE，它将使用ff_styles.css。这似乎没有工作。

 < link rel =stylesheettype =text / csshref =。 ./styles.css\"> 
 
 
 <！[if！IE]> 
< link rel =stylesheettype =text / csshref =../ ff_styles.css> 
<！[endif]> 
 
 <！[if IE 7]> 
< style type =text / css> 
 .web_info 
 {
 left：450px; 
 top：200px; 
 width：300px; 
 height：60px; 
} 
< / style> 
<！[endif]> 
  

有什么建议吗？感谢

解决方案

条件注释是特定于IE的，因此<！[if！IE]> 不是Firefox或任何其他浏览器的有效指令。此外，我建议你尝试下面的语法：

 <！ -  [if IE 7]> 
< style type =text / css> 
 .web_info 
 {
 left：450px; 
 top：200px; 
 width：300px; 
 height：60px; 
} 
< / style> 
<！[endif]  - > 
  

我的最后一个注意事项是：由于IE7 / IE8大多符合标准，因此这些CSS hacks应该是如果可能，请避免使用。

更新：
感谢slosd，我立即改正！根据支持带条件注释的IE 您可以使用以下内容来隐藏IE中的某些内容：

 <！ -  [if！IE]>  - > ; 
做某事; IE会忽略这一点，其他浏览器会解析它
<！ - <！[endif]  - > 
  

不便之处，敬请原谅！

完整的工作示例：

 < link rel =stylesheettype =text / csshref =../ styles.css的> 
 
<！ -  [if！IE]>  - > 
< link rel =stylesheettype =text / csshref =../ ff_styles.css> 
<！ - <！[endif]  - > 
 
 <！ -   -  [if IE 7]> 
< style type =text / css> 
 .web_info {
 left：450px; 
 top：200px; 
 width：300px; 
 height：60px; 
} 
< / style> 
<！[endif]  - > 
  

I have the below code to check if the user are using IE7...and it needs to over ride the .web_info style. If not IE7 it uses the default style, if its not IE at all it will use the ff_styles.css. This doesnt seem to be working.

<link rel="stylesheet" type="text/css" href="../styles.css">


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

<![if IE 7]>
<style type="text/css">
.web_info
{
left: 450px;
top: 200px;
width: 300px;
height: 60px;   
}
</style>
<![endif]>

Any suggestions? Thanks

解决方案

Conditional comments are IE specific and therefore "<![if !IE]>" is not a valid instruction for firefox or any other browser. Additionally I would suggest you try the following syntax:

<!--[if IE 7]>
<style type="text/css">
.web_info
{
left: 450px;
top: 200px;
width: 300px;
height: 60px;   
}
</style>    
<![endif]-->

One final note on my part: Since IE7/IE8 are mostly standard compliant, these CSS hacks should be avoided, if possible.

Update: Thanks to slosd I stand corrected! According to "Supporting IE with conditional comments" you can use the following to hide something from IE:

<!--[if !IE]>-->
do something; IE will ignore this, other browsers parse it
<!--<![endif]-->

Sorry for the inconvenience I caused!

Full working example:

<link rel="stylesheet" type="text/css" href="../styles.css">

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

<!--[if IE 7]>
  <style type="text/css">
  .web_info{
    left: 450px;
    top: 200px;
    width: 300px;
    height: 60px;   
  }
  </style>
<![endif]-->

这篇关于CSS条件格式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！