0

我用这个生成器来生成我喜欢的渐变背景。有了它,我设法创建了以下外观的 CSS 代码。它在不同口味的蓝色之间消失。

background-image: -ms-linear-gradient(top, #2BD0FF 0%, #09ADF1 100%);
background-image: -moz-linear-gradient(top, #2BD0FF 0%, #09ADF1 100%);
background-image: -o-linear-gradient(top, #2BD0FF 0%, #09ADF1 100%);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #2BD0FF), color-stop(1, #09ADF1));
background-image: -webkit-linear-gradient(top, #2BD0FF 0%, #09ADF1 100%);
background-image: linear-gradient(to bottom, #2BD0FF 0%, #09ADF1 100%);

我已将其粘贴在我的 CSS 代码的正文部分。它看起来很流畅,但是当我使用我在另一个主题中发布的代码添加内容时,它会使背景条纹化。

这是一张展示正在发生的效果的图片。图片实际上是我添加 . body云会发生什么(对于云,请参见上面的链接)是相似的,但条纹更宽。

在此处输入图像描述

我的 HTML 页面中包含一些其他元素,body但删除它们不会影响这种情况。我在该head部分中包含了 jQuery 1.9.1,我的代码与之前链接的讨论中的代码完全相同。

是什么导致了这种问题?

4

2 回答 2

0

使用background-repeat: no-repeat. 这应该可以解决问题。

于 2013-04-05T20:09:58.633 回答
0

感谢 albertxing,我找到了正确的关键字并使用 Google 找到了解决方案。似乎该主题已在另一个问题中涉及。

CSS背景渐变重复问题

于 2013-04-05T20:19:30.767 回答