标签: gradient

Internet Explorer的filterCSS属性(-ms-filter来自IE 8)允许您执行CSS渐变,有点像-webkit-gradient和-moz-gradient属性(参见例如问题213750).

但是,语法似乎不允许rgba颜色,因此您不能执行从颜色到透明的渐变.

有没有办法在IE中实现以透明度结束的渐变？

我现在有一个字符串,就像下面显示的一个字符串,我想用它来调整图像.我在2周的时间内搜索了谷歌16小时的访问权限,试图找出答案.我可以将图像加载到画布中.

这就是我要做的.这是一个GIMP示例(类似Adobe Photoshop的开源程序):http://gimpguru.org/tutorials/sampletoning/

0,0,0 0,0,0 0,0,2 0,0,20 0,0,38 0,0,50 0,0,35 0,0,53 0,0,35 0,2,33 0,0,64 0,2,58 0,4,66 0,6,64 0,7,63 0,10,61 0,13,64 0,16,57 0,16,67 0,17,73 0,20,73 0,21,75 0,23,75 0,22,79 0,28,76 0,28,74 0,28,89 0,33,84 0,33,89 0,35,85 0,37,92 0,39,89 0,39,92 0,44,91 0,45,92 12,38,94 0,45,104 4,46,97 18,40,98 6,48,99 17,47,93 7,52,98 9,54,94 13,51,111 7,57,111 10,58,109 15,58,110 16,59,111 13,64,105 16,64,109 16,64,118 17,66,113 22,65,118 23,66,119 17,72,120 27,72,110 28,73,110 23,76,113 30,75,112 37,76,99 29,77,122 37,77,115 38,76,128 45,81,97 33,84,121 38,83,124 33,85,134 44,87,112 47,87,113 66,79,120 45,90,129 47,92,121 47,92,129 45,93,140 …

我想尝试使用跨浏览器渐变效果处理带有rgb后退的值,以防浏览器不支持它.

jsFiddle示例:http://jsfiddle.net/HelloJoe/hUxdh/

我相信我已经覆盖了大多数浏览器,但我有几个问题:

1. 是否还有其他常用的浏览器,以及iPad/SmartPhone等设备需要哪些属性,或者它们是否会从当前使用的属性中进行渲染？

2. 如果没有渲染渐变,是否有background: rgb(50, 50, 50);足够的原始生成纯色？

3. 有了这个filter值,我无法通过使用rgb值来使其工作,而不得不求助于使用hex值,而不是这是一个巨大的问题,但我只是尝试使用rgb值.有没有办法解决这个问题还是不接受它们？

4. 如果我要使用rgba而不是rgb我需要有一个rgba渐变背景值,rgb渐变背景值作为后退不能渲染alpha透明度然后一个实心背景后退以防万一没有渲染渐变？或将浏览器忽略Alpha透明度值,只是显示了rgb从rgba没有单独的rgb背景回落？

5. 作为一切的最后回落,是否hex需要在CSS属性的开头设置一个值？我想添加一个hex值没有什么害处,但使用的想法rgb是if rgba是否可用它可以在整个网站上快速轻松地进行颜色更改.所以有一个后退hex值将使rgb/rgba我无意使用它所用的东西,因为我需要经历并编辑所有hex值.

我做了一些搜索,实例各不相同,理解被误解为不同的人,我只是试图创建一个准确的工作示例来获得理想的结果.

我正在学习Postscript我正在尝试创建一个方法来绘制垂直渐变.

这是我的代码:

%!PS-Adobe-3.0

%%%%%%%%%%%%%%%%%%%%%%%
% draw a RECTANGLE
/Rect {
/h exch def % height
/w exch def % width
w 0 rlineto
0 h rlineto
-1.0 w mul  0 rlineto
0 -1.0 h mul rlineto
} def
%%%%%%%%%%%%%%%%%%%%%%%
% draw a Gradient
/VGrad {
/h exch def % height
/w exch def % width
/c2 exch def %gray-end
/c1 exch def %gray-start
/index 0.0  def %loop-index

0 1 h { %loop over height
    gsave
    c2 …

我试图让一些文字有渐变色,但我不知道如何.我试着这样做:

我唯一尝试过的是-webkit-mask,但是我无法按照自己的意愿行事.另一件事是-webkit-gradient在color财产 - 可能吗？

跨浏览器兼容性相当重要,但不是世界末日.我更喜欢IE中的文本是纯色而不是将整个事物转换为图像(这里有相当多的文本,其中一些是动态的).

我在Android中有一个动态生成的位图,我想从顶部边缘羽化,使边框区域在顶部完全透明,并逐渐变为完全不透明,略低于下方.

创建均匀完全透明的顶边

transparentPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
transparentPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_OUT));
Shader shader = new LinearGradient(0, 0, 0, 20,
                    Color.TRANSPARENT, Color.TRANSPARENT, Shader.TileMode.CLAMP);
transparentPaint.setShader(shader);
// the bitmap is dynamically generated beforehand
Canvas c = new Canvas(bitmap);
c.drawRect(0, 0, bitmapWidth, 20, transparentPaint);

Alpha渐变而不是完全透明的孔？

你会如何实现这样的目标:

[在这种情况下只是最顶端]

我读到k-means算法只收敛到局部最小值而不是全局最小值.为什么是这样？我可以从逻辑上思考初始化如何影响最终的聚类,并且有可能进行次优聚类,但我没有找到任何可以在数学上证明这一点的东西.

另外,为什么k-means是一个迭代过程？我们难道不能将目标函数wrt部分区分为质心,将其等于零以找到最小化此函数的质心吗？为什么我们必须使用梯度下降来逐步达到最小值？

我在css3中做一个div的渐变边框.到目前为止,我已经完成了这样的编码

在css

.bot-left {
  position: relative;
}
.bot-left:before, .bot-left:after {
  content: "";
  position: absolute;
  bottom: -3px;
  left: -3px;

}
.bot-left:before {
  top: -3px;
  width: 3px;
  background-image: -webkit-gradient(linear, 0 100%, 0 0, from(#000), to(transparent));
  background-image: -webkit-linear-gradient(transparent, #000);
  background-image: -moz-linear-gradient(transparent, #000);
  background-image: -o-linear-gradient(transparent, #000);
}
.bot-left:after {
  right: -3px;
  height: 3px;
  background-image: -webkit-gradient(linear, 0 0, 100% 0, from(#000), to(transparent));
  background-image: -webkit-linear-gradient(left, #000, transparent);
  background-image: -moz-linear-gradient(left, #000, transparent);
  background-image: -o-linear-gradient(left, #000, transparent);
}

在HTML中

  <div class="bot-left" style="width: 200px; height: 200px"></div>

但我仍然没有得到完全匹配作为参考.渐变边框的参考图像附有此

更新 我希望背景颜色应该是透明的.

我有一个UIScrollView包含非常广泛的UIView子类的子类，并且我希望淡出可见内容的边缘。这是UIScrollView子类中的内容：

private var gradientMask = CAGradientLayer()
override func layoutSubviews() {
    super.layoutSubviews()

    gradientMask.frame = self.bounds
    gradientMask.colors = [UIColor(white: 0.0, alpha: 0.18).CGColor,
        UIColor(white: 0.0, alpha: 0.95).CGColor,
        UIColor(white: 0.0, alpha: 0.95).CGColor,
        UIColor(white: 0.0, alpha: 0.0).CGColor
    ]

    let fadeStart:CGFloat = 50.0 / self.bounds.width
    gradientMask.startPoint = CGPoint(x:0, y:0.5)
    gradientMask.endPoint = CGPoint(x:1, y:0.5)
    let fadeEnd = (self.bounds.width - 40.0) / self.bounds.width
    gradientMask.locations = [fadeStart,fadeStart+0.1,fadeEnd,1.0]

    self.layer.mask = gradientMask
}   

它确实有效，但是有一个滞后。滚动后，渐变会随着内容滚动一会儿，然后恢复到预期位置。如何确保滚动视图的边缘淡出-滚动时渐变不移动？

我正在尝试实现一个充满渐变的三角形.三角形应位于页面的左上角,并拉伸50%的水平视口和120%的垂直视口.

我需要三角形有一个贯穿它的渐变.
我已经设法做了前三件事,但我无法使梯度起作用.
我已经尝试以不同的方式定位伪元素溢出并transform: rotate();实现它但我无法让它工作.

这是我到目前为止的JSfiddle:

.triangle {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0px 0 120vh 50vw;
  border-color: transparent transparent transparent green;
}

<div class="triangle"></div>