发表新帖
发表新帖

I want the background picture not to be displayed in the IE. How do I do that?

后端 未结
关注
8 1458
暗喜
暗喜 2020-12-22 05:04

Here\'s the CSS , and I want the background picture not to be displayed in IE . Instead I just want the background color to be displayed. How do I do that?

h
相关标签:
8条回答
  • 无人共我
    2020-12-22 05:15

    Depending on which version(s) of IE you want to target, you can use conditional comments (and/or an IE-only stylesheet):

    http://css-tricks.com/how-to-create-an-ie-only-stylesheet/

    Note that this won't work in IE10.

    0 讨论(0)
  • 清歌不尽
    2020-12-22 05:21

    use conditional statement.

    <!--[if IE]>
Place IE specific content.
<![endif]-->

    If version specific, you can mix the code like this -

    <!--[if lt IE 8]>
Place content for IE lower than 8
<![endif]-->

    created a rough tested code, and checked in IE 9 -

    <!--[if gte IE 8]>
<style>
html, body {       
  background: #a9ac41;
  background-image: url("http://dummyimage.com/600x400/000/fff.png");    
  background-repeat: no-repeat;
  background-size: cover;    
  margin:0;
  padding: 0;     
}
</style>
<![endif]--> 

<html>
<body>
<body>
</body>
</html>

    EDIT

    Conditional statements wont work for IE10 so you can manage it via media queries.

    Example thread - https://gist.github.com/atk/4025104

    0 讨论(0)
  • 难免孤独
    2020-12-22 05:24

    Copy and paste this code in your html.

       <!--[if IE]>
    <stye>
      html, body {    
        background-image: none; 
      }
    </style>
   <![endif]-->
    0 讨论(0)
  • 野趣味
    2020-12-22 05:31

    Conditional stylesheets are what you need. By using the code below you can set a stylesheet that is only used in IE, in which you can set an alternative style for the body.

    <!--[if IE]>
    <link rel="stylesheet" type="text/css" href="all-ie-only.css" />
<![endif]-->
    0 讨论(0)
  • 旧时难觅i
    2020-12-22 05:32

    There's lots of different ways to do this, and it really depends on what else you're doing with the page. One simple way would be the following HTML in the <head> tag.

    <!--[if IE]><style>html,body{ background-image: none; }</style><![endif]-->

    0 讨论(0)
  • 情深已故
    2020-12-22 05:34

    I'm guessing that the problem here is background-size. IE8 and earlier don't support it, so you're seeing your image messed up in IE8 and you want to solve it by reverting to a plain background.

    Firstly, I should tell you that background-size is supported in IE9 and later, so you don't need to do this as a blanket change for all IE versions. You only really need to deal with the lack of support in IE8 and earlier.

    Here are some options for you:

    • Pure CSS solution:
      You can take advantage of the way CSS handles unknown properties to provide a pure CSS fallback for browsers that don't support background-size, by specifying the size as a parameter in a shorthand background style:

      background: #a9ac41;
background: url("bgimage.png") cover;

      IE8 will ignore the second background entirely because doesn't understand cover. Other browsers will ignore the first one because the second one overrides it. Problem solved: all browsers have a working background.

    • Feature detection solution:
      You could use a tool like Modernizr to test for browser support of background-size, and then use Javascript to change the page accordingly (eg load a different stylesheet if it is/isn't supported).

    • filter solution:
      Although IE8 doesn't support background-size, it is possible to use the -ms-filter property to emulate it, with some degree of success. You would use code like this:

      -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='path_relative_to_the_HTML_file', sizingMethod='scale')";

      Example taken from MDN

    • Polyfill solution:
      There are some 'polyfill' scripts available which implement some of the missing CSS features into old IE versions, including background-size. In this case, the one I'd recommend is CSS3Pie. Follow the instructions on the css3pie site and you'll be able to use standard background-size even in very old IE versions.

    Hope that helps.

    0 讨论(0)
 看不清?
提交回复
热议问题