CSS背景仅在Firefox中向一个方向重复
[英]CSS Background repeat round to one direction only in Firefox
问题描述
我想结合使用backround-repeat round和repeat-x 。 在许多不同的网页上，我都看到background-repeat: round等于background-repeat: round round ，这意味着Round time重复X，而Round time重复Y ，不是吗？ 这就是为什么我认为round no-repeat写作只会重复一个方向。
我的代码向各个方向重复。 我正在使用Firefox 30.0 。
<!DOCTYPE html>
<html>
<body style="background-image: url('bg.png'); background-repeat: round no-repeat">
</body>
</html>
它是特定于浏览器的还是如果有办法我应该采取其他方式吗？
3 个解决方案
解决方案1
2 已采纳 2014-07-09 01:07:54
是的，它应该像您想的那样工作。
问题在于Firefox还不支持价值round 。 然后，该规则将被忽略，并且使用的值是默认的repeat 。
您可以在MDN文章中看到浏览器支持：
- Chrome：否
- Firefox：否（ 错误548372 ）
- IE：9
- 歌剧：10.5
- Safari：否
作为一种解决方法，我建议使用一个后备值：
background-repeat: repeat no-repeat; /* fallback for old browsers */
background-repeat: round no-repeat; /* for browsers that support it */
解决方案2
0 2014-07-09 01:09:07
根据background-repeat的MDN页面以及Bugzilla上的此问题 ， background-repeat: round; 仅在IE 9和Opera上受支持。 由于Firefox无法识别round关键字，因此默认情况background-repeat: repeat;使用默认的background-repeat: repeat; 。
Firefox 30不支持该功能，目前尚不清楚何时在Firefox中实现它。
解决方案3
0 2014-07-09 01:11:02
它是特定于浏览器的，因为只有少数浏览器支持。 我的解决方法如下：我只会使用background-repeat:repeat no-repeat 。
至于“回合”与“回合”，这是我们看到的很多东西。 让我解释：
如果只给出一个参数，例如。 “重复”它适用于所有方向。
如果给出两个参数，则它们定义了X和Y方向，例如。 “重复不重复”
第一个表示x，第二个表示y。
如果给定三个，则例如具有“顶部”，“侧面”和“底部”。 “边距：顶边底边”
如果是四个，则为“上，右，下，左”（顺时针）。 “边距：右上左下”
CSS过渡仅在一个方向上具有动画效果-jQuery滚动功能
[英]css transition only animated in one direction - jQuery scroll function
如何强制 div 在 CSS/jQuery 中仅在一个方向上扩展或调整大小
[英]How to force a div to expand or resize only in one direction in CSS/jQuery
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.