标签: linear-gradients

请看http://jsfiddle.net/ghAgQ/ 我需要箭头的相同渐变,就像矩形一样.任何想法如何做到这一点？谢谢

.rectangle {
background-color: #EEE;
height: 80px;
width: 240px;
border: 1px solid #CCC;
background: white;
cursor: pointer;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,white),             color-stop(37%,#F1F1F1), color-stop(57%,#E1E1E1), color-stop(100%,#F6F6F6));
float: left;
}

.arrow {

border-top: 41px solid transparent;
border-bottom: 41px solid transparent;
border-left: 15px solid #C4C4C4;
float: left;
cursor: pointer;

}

​

是否可以使用CSS在时事通讯电子邮件中使用渐变元素？是否支持完整属性？

我有一个问题:我需要能够采用两种颜色并从中制作出"虚拟渐变".然后,我需要能够在此行的任何位置找到颜色.我目前的做法是:

if (fahrenheit < kBottomThreshold)
{
    return [UIColor colorWithRed:kBottomR/255.0f green:kBottomG/255.0f blue:kBottomB/255.0f alpha:1];
}
if (fahrenheit > kTopThreshold)
{
    return [UIColor colorWithRed:kTopR/255.0f green:kTopG/255.0f blue:kTopB/255.0f alpha:1];
}

double rDiff = kTopR - kBottomR;
double gDiff = kTopG - kBottomG;
double bDiff = kTopB - kBottomB;

double tempDiff = kTopThreshold - kBottomThreshold;

double rValue;
double gValue;
double bValue;

rValue = kBottomR + ((rDiff/tempDiff) * fahrenheit);
gValue = kBottomG + ((gDiff/tempDiff) * fahrenheit);
bValue = kBottomB + ((bDiff/tempDiff) * fahrenheit);

return [UIColor colorWithRed:rValue/255.0f green:gValue/255.0f …

我想要为线性渐变的中心设置动画,以便在开始时整个drawable是color1,最后整个drawable是color2,并且在渐变的中心之间从左到右移动.

GradientDrawable gd = new GradientDrawable(
                              GradientDrawable.Orientation.LEFT_RIGHT,
                              new int[] {color1, color2});
gd.setCornerRadius(0f);
gd.setGradientCenter(x, 0);
view.setBackgroundDrawable(gd);

问题是setGradientCenter没有任何区别.根据这个答案/sf/answers/1006878211/ setGradientCenter()存在问题但是这个答案中的解决方案对我不起作用,因为我在用户滑动时更改onTouch()中的渐变他的手指在视野上,所以它需要非常快.

有没有办法做到这一点？

我想做这样的事情(所有触摸的东西都很好但不是动画渐变):

我在webkit浏览器(Chrome,Opera)中遇到了一个奇怪的问题.

测试用例:http://sample.easwee.net/gradient-bug/(登录Chrome或最新Opera)

我有两个由容器包裹的列.我正在应用CSS渐变来为这两列创建背景.颜色停止设置为66%和列具有相同的66%宽度(使用填充来偏移右列).

它在Firefox中正确呈现 - 列布局和渐变停止点匹配,但在基于webkit的浏览器中,颜色停止与列宽不匹配,尽管我已经使用过66%.

HTML:

<div class="special-container">
    <div class="special-container-inner">
        <div class="special-container-column-L">
            <img src="http://placehold.it/1070x600" />
        </div>
        <div class="special-container-column-R">
            <img src="http://placehold.it/530x345" />
            <h3>Test</h3>
            <p>It uses a dictionary of over 200 Latin words, combined with a handful of model sentence structures, to generate Lorem Ipsum which looks reasonable.</p>
        </div>
        <div class="clear"></div>
     </div>
</div>

CSS:

.special-container {}
.special-container-inner {max-width:1600px;margin:0 auto;
    background: #ff0000;
    background: -moz-linear-gradient(left,  #ff0000 0%, #ff0000 66%, #2989d8 66%, #2989d8 66%, …

我是iOS开发的新手,我正在尝试学习Swift.我想对UITableView应用垂直alpha渐变,但是遇到了一些麻烦.

最初在这篇SO帖子之后,我做了以下事情:

var gradientMaskLayer:CAGradientLayer = CAGradientLayer()
gradientMaskLayer.frame = myTableView.bounds
gradientMaskLayer.colors = [UIColor.clearColor().CGColor, UIColor.blackColor().CGColor]
gradientMaskLayer.locations = [0.0, 0.05]
myTableView.layer.mask = gradientMaskLayer

在得到错误Array element cannot be bridged to Objective-C并阅读此SO帖子后,我修改了使用的两个数组:

var gradientMaskLayer:CAGradientLayer = CAGradientLayer()
var gradientMaskColors:NSArray = [UIColor.clearColor().CGColor, UIColor.blackColor().CGColor]
var gradientMaskLocations:NSArray = [0.0, 0.05]
gradientMaskLayer.frame = myTableView.bounds
gradientMaskLayer.colors = gradientMaskColors
gradientMaskLayer.locations = gradientMaskLocations
myTableView.layer.mask = gradientMaskLayer

现在得到错误 Value failed to bridge from Swift type to a Objective-C type

我很难找到解决方案.可以提供一些帮助吗？

我正在尝试使用绘制角度渐变CaGradientLayer.我知道角度可以使用startPoint和定义endPoint.我可以为一些标准角度计算这些点,如0,90,180,360等.但我希望将这些点制定为任意角度.我曾尝试用一些三角函数计算它,但没有取得任何成功.任何人都可以给我任何方向如何计算任意角度的这些点？

我用这个代码用一个Lineargradient做了一个色调渐变:(我知道它本来可以变得更简单Color.parseColor但是我必须这样做.我也不能使用drawable.)

colors = new int[]{ Color.HSVToColor(new float[]{0, 1, 1}),
                    Color.HSVToColor(new float[]{60, 1, 1}), 
                    Color.HSVToColor(new float[]{120, 1, 1}), 
                    Color.HSVToColor(new float[]{180, 1, 1}),
                    Color.HSVToColor(new float[]{240, 1, 1}), 
                    Color.HSVToColor(new float[]{300, 1, 1}), 
                    Color.HSVToColor(new float[]{360, 1, 1}) };
Shader shader = new LinearGradient(0, 0, width, 0, colors, null, Shader.TileMode.CLAMP);
paint.setShader(shader);

产生这种结果的颜色略有偏移,绿色区域太小,蓝色区域与预期结果相比太大.

我查了一切.我尝试使用new float[]{0f, 1/6f, 2/6f, 3/6f, 4/6f, 5/6f, 1f}而不是null位置参数,相同的结果.这可能也是一个错误.

请注意,这不是重复这个帖子也不是这一个.这些是关于在代码中设置的不正确的渐变停止,这不是我的情况.它可能与这个有关,但我不知道如何.

编辑:也许这可以通过设置不相等的位置来解决,但我怎样才能计算出这些确切的位置？

有没有办法在iOS中将LaunchScreen.xib的线性渐变设置为背景？有点像background="linear-gradient(#000000, #123456)"？

<view contentMode="scaleToFill" background="...">
    <rect key="frame" width="753" height="867"/>
</view>

在SVG渐变中，您可以设置起始xy和终止xy位置。是否有可能在CSS中做到这一点。

这是原始设计：

这是我的线性梯度的SVG：

.myRectangle {
	width: 331px;
	height: 137px;
	left: 0px;
	top: 0px;
}

<svg class="myRectangle">
  <linearGradient id="LinearGradientFill2" spreadMethod="pad" x1="1" x2="0.5" y1="0" y2="0.5">
    <stop offset="0" stop-color="#f7f7f7" stop-opacity="1" cssvalue=""></stop>
    <stop offset="0.266" stop-color="#ea0000" stop-opacity="1" cssvalue=""></stop>
    <stop offset="0.7685" stop-color="#6c165f" stop-opacity="1" cssvalue=""></stop>
    <stop offset="1" stop-color="#272020" stop-opacity="1" cssvalue=""></stop>
  </linearGradient>
  <rect fill="url(#LinearGradientFill2)" id="myRectangle" rx="0" ry="0" x="0" y="0" width="331" height="137">
  </rect>
</svg>

这是我的CSS线性渐变：

#rectangle {
  width: 100%;
  height: 200px;
  position: absolute;
  top: 0;
  left: 0;
  background: linear-gradient(225deg, rgba(255,255,255,1) 0%, rgba(250,0,0,1) 27.59%, rgba(108,22,95,1) 76.35%, rgba(39,32,32,1) 100%)
}

<div …