Q

在IE中不工作的CSS“no-repeat”

2012-04-09 55 views 1 likes

1

在CMS中使用一些内联CSS（好玩！）。这段代码的工作原理与Chrome和Firefox应该一样，背景图像只出现一次。但是，当页面加载到IE 9中时，就好像不重复值被忽略，并且背景图像在div的长度上重复。在IE中不工作的CSS“no-repeat”

<div style="width: 500px; margin-top: -10px; background-image: url(http://.../uploadedImages/horizontal-rule-top.gif); background-position: 50% 0%; background-repeat: no-repeat, no-repeat; "><p style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; color: rgb(228, 128, 28); padding-top: 30px; padding-bottom: 15px; font-size: 16px; "> 
...</div>

任何意见将不胜感激！

2012-04-09 acdanger

A

回答

5

我认为IE浏览器遇到第二个no-repeat存在问题，根据规范，无视它不理解的规则。 IE浏览器理解的选项似乎是：

repeat-x，
repeat-y和
no-repeat。

如果你修改你的CSS到上面的其中一个应该工作。

2012-04-09 19:57:09

+0

看来[IE9支持多种背景]（http://caniuse.com/#feat=multibackgrounds），但是其实现可能存在一些问题，这些问题在这里显示。 – BoltClock 2012-04-09 19:59:34

+0

是的，当我意识到它可能是多背景实现的问题时，我投了你的答案。 – 2012-04-09 20:02:42

0

尝试background-repeat: no-repeat;没有第二个值。我相信这两个值语法是CSS3 working draft的一部分，可能不会被IE9实现。

2012-04-09 19:59:36 twaddington

0

试试你的背景CSS“background：url（http：//.../uploadedImages/horizontal-rule-top.gif）no-repeat 50％0％;”

2012-05-16 10:19:46

0

Prova con：

background-repeat-x：no-repeat; background-repeat：repeat-y;

2014-12-04 14:21:45 GiC

相关问题