CSS:反向重复线性渐变

文章/答案/技术大牛

发布

3回答

html、css、repeat、linear-gradients

有没有一种方法可以让梯度背景的每个交替重复变成相反的？目前，我有以下CSS：html { backgroundhtml> </head> Hello world</html>目前，它从蓝色到白色，从上到下，但当我向下滚动时，它再次

浏览 24提问于2016-08-10得票数 3

回答已采纳

4回答

单击按钮时更改按钮颜色

jquery、css

我有一个带有css背景线性渐变的按钮，但是当单击该按钮时，我想要反向渐变。事情是这样的，我的意思是点击，就像鼠标在按钮上按下鼠标，然后按下鼠标按钮，但当你放开鼠标按钮时，我想让它恢复正常。

浏览 1提问于2015-02-15得票数 1

4回答

带有或不带有图像的条纹双色背景？

css

我想为创建一个漂亮的条纹对角或水平背景(黄色和黑色)，但找不到任何教程如何做到这一点。

浏览 0提问于2012-02-21得票数 5

回答已采纳

8回答

如何防止CSS渐变条带？

css、gradient、linear-gradients

我开始使用CSS渐变，而不是实际的图像，原因有两个:第一，CSS渐变的加载速度肯定比图像快，第二，它们不应该像许多光栅图形那样显示条带。我最近开始在不同的屏幕上测试我的网站，在更大的屏幕(24+英寸)上，构成我网站背景的CSS线性渐变显示出非常明显的条带。作为一个临时修复，我已经用一个小的，重复的，透明的PNG噪声图像覆盖了渐变，这有一点帮助。有没有其他方法来解决这个条带问题？

浏览 2提问于2012-07-26得票数 45

回答已采纳

3回答

只使用CSS梯度创建立方体

html、css、graphics、3d

我试过很多种方法，使用线性梯度来创建几个层叠在一起的条纹，并且变得非常接近，但似乎被卡在了顶部。我试图用渐变来完成这个任务，无论是线性的还是径向的，这样我最终可以将它们升级到重复的渐变，并且有一个很好的立方体背景。我正在将css应用到一个空的body标记上。

浏览 2提问于2015-05-17得票数 3

回答已采纳

1回答

有没有办法做一个重复的CanvasGradient？CanvasRenderingContext2D.createLinearGradient或createRadialGradient上看到任何选项，也没有在CanvasGradient上看到任何适用的属性但考虑到CSS3我已经想出了一种使用CanvasRenderingContext2D.createPattern (参见下面的答案)重复线性渐变的变通方法，但没有一种方法可以制作重复的径向渐变。

浏览 11提问于2019-06-01得票数 0

1回答

可以用css3重复渐变创建此图案吗？

css、gradient

嗨，我有这个图像，我想用它做一个背景渐变，而不是把它放到CSS中：有没有可能，或者我正在突破CSS3梯度的极限。我并不是在寻找一个具有多个div或任何类型的hack的解决方案，只是为一个css类寻找渐变或重复渐变，我可以将其分配给一个元素，并将所需的模式分配给它。更新：如果你检查上面的图像，你会发现蓝色的条纹没有相同的宽度，所以根据的答案，2个梯度不足以拥有这个图案，我们需要7个，但是我没有实现这个图案与常规的线性梯度或重复</e

浏览 0提问于2014-11-23得票数 0

2回答

react原生支持重复线性梯度吗？

react-native

我试图在React Native中为我的视图提供一个重复的线性渐变。然而，我找不到任何可以帮助我使用它的信息或库。我发现了一个名为react-native- linear gradient的库，但它似乎只有简单的线性梯度。提前感谢您的帮助 CSS background: repeating-linear-gradient( #222, #333 10px, #333

浏览 12提问于2019-06-10得票数 4

1回答

使用IE在extjs4中设置css按钮的样式

css、button、extjs

我正在尝试在extjs中设置我的按钮的样式。以下命令适用于除IE以外的所有浏览器。有人能说出为什么会发生这种情况吗？ background-image: -webkit-linear-gradient(top,#DBEEFF,#D0E7FF 48%,#BBD2F0 52%,#BED6F5); b

浏览 2提问于2012-04-05得票数 1

回答已采纳

2回答

线性梯度与其所属元素不匹配

css、gradient

我一直很难弄清楚为什么为body元素指定的线性渐变会在它的一个子元素的边缘后停止。<!UTF-8"> <body> </body>这就是页面最终的样子(注意向下重复渐变)：所以，问题是，渐变在

浏览 0提问于2012-03-08得票数 0

回答已采纳

1回答

SVG元素的对角影线

css、svg

我想使用css在svg中添加对角线颜色的阴影线到多边形。我知道你可以使用模式，但是当有太多不同的模式时，我担心性能问题，这就是为什么我更喜欢使用css。我找到了重复线性渐变，但无法使其在svg元素上工作。这有可能吗？如果没有，在css中是否有其他方法可以向svg元素添加对角线阴影？

浏览 0提问于2019-06-17得票数 0

2回答

使用CSS线性渐变生成纯色(不是平滑颜色)

css、gradient、linear-gradients

假设我的线性CSS渐变如下所示：它将生成如下所示的CSS渐变：如何制作相同的渐变，但使用纯色，而不是在颜色之间过渡？(使用CSS) 谢谢

浏览 6提问于2017-07-14得票数 13

回答已采纳

1回答

react原生中的Css线性渐变

css、react-native

我正在尝试使用react-native-linear-gradient来实现一个css类线性渐变的视图，但插件只允许2种颜色它不允许我设置的渐变是径向的，这是css格式的线性渐变linear-gradient

浏览 24提问于2018-08-13得票数 2

1回答

渐变边框不填充页眉和页脚部分

html、css、background-image、linear-gradients、background-repeat

我在插入背景图像和使页眉和页脚部分具有渐变背景时遇到问题。我的背景图像必须重复。.gif图片是否必须与css位于同一文件夹中？这是它的css。background-image: url("folder1/pic.gif");} 我也在做一个从白色到橙色再到黑色的线性渐变然后，此渐变将成为页眉和页脚部分的背景。这是标题的html部分。</h3

浏览 5提问于2016-09-29得票数 0

1回答

如何制作局部附加的重复线性渐变

html、css、background-attachment、repeating-linear-gradient

我最近一直在尝试制作一个文本区域，它使用重复的线性渐变来分隔行，但是，当我滚动时，渐变不会附加到文本框中。我做错了什么吗？顺便说一下，代码如下： <!10px;</style> </script> 另外，下面是我使用的一些URL： Numbered and separated rows in a textarea 重复线性渐变教程(https://d

浏览 20提问于2021-04-20得票数 0

回答已采纳

1回答

当有100vh的多个部分时，如何对整个网页应用线性梯度？

css、background、viewport、linear-gradients

我想有一个线性渐变为我的整个网站使用HTML/CSS -从一种颜色(说红色)在开始到另一种(说蓝色)在结束。当用户请求页面时，当他们向下滚动时，他们首先看到蓝色背景逐渐变成红色背景。问题是，当我使用100vh将网站与部分分开时，每个部分的线性梯度都会重复--而不是线性地改变部分。first section</div><section> <div class="&

浏览 16提问于2019-06-18得票数 0

2回答

应用于锚标签IE 11的相同类生成两个不同的背景图像

html、css、internet-explorer-11

我最终得到了Button 1- rgba(0，0，0，0)线性渐变(rgb(0，81，0) 0%，rgb(36,138，30) 100%)重复滚动0%0%/自动填充框边界框我不明白为什么我会得到使用同一个类生成的两个不同的值。这是类的背景属性: background:线性渐变(到底

浏览 22提问于2017-07-25得票数 1

5回答

在使用CSS渐变时添加图像？

html、css

我正在尝试创建一个按钮使用CSS渐变加上一个图标，走在顶部的渐变。我试了两种方法，都失败了。但我也听说过CSS3的多背景图像，所以我尝试了一下。

浏览 0提问于2010-08-24得票数 5

回答已采纳

3回答

CSS条纹，重复线性渐变错误

css、linear-gradients

我在CSS中有一个带条纹的分隔线，带有重复的线性渐变，但它做了一些奇怪的事情，这是一张图片：正如你所看到的，一些条纹的粗细是不一样的，我想有像这样的条纹分隔符，但都有相同的“字体-粗细”，我试图修复代码增加或减少像素

浏览 0提问于2018-08-31得票数 5

1回答

如何用角度指定SVG线性梯度

css、svg、gradient

我想指定一个SVG线性渐变，以精确地复制CSS线性渐变行为。例如，在CSS渐变中，您可以指定渐变的起点和终点分别位于框的左上角和右下角。当框调整大小时，背景渐变会自动适应新的大小。在我的第一次尝试中，我用SVG复制了一个CSS线性渐变，通过指定一个角度，并根据框的大小计算x1，y1，x2，y2坐标。但如果调整了框的大小，则渐变的角度不会改变，也不再正确。我的下一个

浏览 1提问于2012-02-25得票数 6

回答已采纳

点击加载更多