问题标签 [radial-gradients]

我正在使用 CSS 背景渐变来创建透明的径向渐变效果。如果您在 Chrome 中查看此处：http ://dev.aaronpitts.ch/unitymedia/index.html ，您会看到它按我的意愿工作（社交媒体、SEM、网页设计和开始您的旅程背景）。问题是其他浏览器不能保持平滑并切断边缘。有任何想法吗？

这是我正在使用的代码：

我尝试添加（径向）渐变作为背景（在 Android 4.0 中），作为背景图像或以编程方式，但它们都不起作用。我只能在模拟器中测试它，但我想在 4.0 设备上是一样的。

这些解决方案不起作用：

• 放置在原始文件夹中。(禁用Android资源/图片/png优化)
• 制作具有抖动和抗锯齿的代理 xml，并将 png 的不透明度保存到 99%。（android:dither="true" 不抖动，怎么了？）
• 覆盖 onAttachedToWindow（Android：使用线性渐变作为背景看起来是带状的）
• 移动到 hdpi 文件夹（姜饼上的渐变）
• 以编程方式制作渐变（http://crazygui.wordpress.com/2010/09/05/high-quality-radial-gradient-in-android/）

我想我尝试了更多的东西，但也许有人知道如何建立一个工作渐变作为背景？

我当前的代码如下所示：

和 background_image.xml

我想创建一个渐变可绘制矩形作为视图的背景

它应该看起来像这样

现在看起来像这样

它看起来像这样：

这是我的可绘制代码

我该怎么做才能让它看起来像我需要的那样？

做多个渐变相当新。我有一个线性渐变，然后是顶部的径向渐变。

它工作正常，但我想知道为什么径向渐变的大小以像素为单位定义，但它的行为就像一个 %.

查看：http: //jsfiddle.net/tK5Ch/

当您调整浏览器大小时，径向渐变会四处移动。我只是想让它固定，比如 100px x 100px

任何想法发生了什么？

我正在尝试完成以下任务：

基本上，这只是一个块元素：

如何将径向渐变图像放在元素边框的左上角？

梯度的结果应该不一样？为什么它们如此不同......我错过了什么吗？

演示

SVG

CSS

我想知道是否可以单独使用 css 渐变来做这样的事情：

http://postimg.org/image/nxciwsv4f/

在此示例中，中心橙色将在所有方向上逐渐变为灰色。黑色矩形代表一个 div。

我在 w3 学校上找不到这个，尽管还有其他各种与梯度相关的功能。

是否可以用css制作虚线文本？

我知道显而易见的事情是使用点字体，但如果我只需要谨慎地使用点文本，那么让用户下载整个字体可能会过度。

我的想法是用带有白色背景的小透明圆圈的背景图案的伪元素覆盖文本。

像这样的一些事情：

小提琴

CSS

我想我可能很接近，但是如果您更改字体大小，上述解决方案将无法正常工作。

我正在寻找一个解决方案

1）随着字体大小的增加，点的大小会增加，并且

2）最好每个字母只显示一行点 - 而不是现在的双线。

编辑：当我说一行点时 - 我的意思是每个笔划应该只由一个点组成。例如：在上图中，请注意“m”字符有 2 列点....好吧，我只喜欢一个。

理想情况下是这样的（取自这里）：

（我不确定，但可能需要调整径向渐变才能做到这一点）

编辑：

1）我不介意使用哪种字体 - 只要它是内置字体。（即使是等宽字体也可以）

2）该解决方案不需要在每个浏览器中都有效。（所以只有 webkit 的解决方案就可以了）

我是 Web 开发的新手，我刚刚开始为自己的个人网站编写代码。我绝对不知道 html 或 css 的任何语法。通过在线阅读和观看教程，我已经设法创建了我网站的背景渐变，但渐变的表现并不如我所愿。我希望在调整浏览器窗口大小时渐变保持相同的比例。现在渐变根据窗口大小进行拉伸。

请帮忙。这是我到目前为止的css代码

我的D3 circle pack样子是这样的：（也可以通过jsfiddle 访问）

但是，我希望图表看起来像这样：（不要注意标签或圆圈包装的位置，它们对我的情况不是必需的；我的意思是共同显示圆圈的“3d”外观及其颜色）

实现这一目标的好方法是什么？

在@Delapouite 回答之后，我整理了另一个jsfiddle：

关键代码是：

和