我有一个下拉列表，其中溢出的文本是渐变输出。有一个过渡应用于选择的包装器，但现在它看起来有点奇怪，当它悬停出来时。我怎么才能让它看起来更好呢？
html代码片段：
<div class="durationDropdown">
<select role="listbox" class="durationSelect">
<option value="0">Less than 1 month</option>
</select>
</div>
css
浏览 3提问于2019-03-20得票数 0
当使用CSS3渐变时，我们应该使用background-image还是只使用background来应用它们？
例如：
background: #CCC;
background: -moz-css3-gradient-code;
background: -webkit-css3-gradient-code;
或
background: #CCC;
background-image: -moz-css3-gradient-code;
background-image: -webkit-css3-gradient-code;
浏览 1提问于2010-11-02得票数 3
回答已采纳
8回答
我开始使用CSS渐变，而不是实际的图像，原因有两个:第一，CSS渐变的加载速度肯定比图像快，第二，它们不应该像许多光栅图形那样显示条带。我最近开始在不同的屏幕上测试我的网站，在更大的屏幕(24+英寸)上，构成我网站背景的CSS线性渐变显示出非常明显的条带。作为一个临时修复，我已经用一个小的，重复的，透明的PNG噪声图像覆盖了渐变，这有一点帮助。有没有其他方法来解决这个条带问题？
浏览 2提问于2012-07-26得票数 45
回答已采纳
6回答
我有一个需要渐变背景的<div>。然而，div的大小是可变的，这让我回到了“无法在CSS中做渐变”的境地。
然而，我非常确定这在jQuery中是可能的，我只是似乎找不到一个像样的例子。有没有人能给我指个方向？
谢谢。
浏览 0提问于2009-01-26得票数 3
需要帮助！
我试图把一个英雄形象放在我的背景主页上，但它在我身上失败了。图像位于css之外的单独文件夹中，因此我使用了(../)。它仍然不成功。我还处于初学者的水平。
hero-image{
background-image:linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(../images/graduate.jpg);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
浏览 0提问于2020-11-25得票数 1
2回答
我正在尝试CSS关键帧动画和webkit径向渐变背景。我想在身体标签上有一个发光的圆形/radial梯度，3秒后径向梯度移动到右侧并消失。
在我的实验中，我发现在关键帧动画中，你不能为每个阶段创建不同值的渐变，比如0%，25%，50%，100%。
我的HTML文件张贴在这里，请看一下。
浏览 5提问于2011-01-05得票数 0
3回答
我已经使用下面的CSS制作了一个梯形的div，使用CSS技巧和有角度的边框：
#slopedDiv {
position: absolute;
height: 0;
width: 100px;
border-style: solid;
border-color: #DC0714 transparent;
border-width: 248px 125px 0 0;
}
<div id="slopedDiv"></div>
是否可以将垂直线性渐变应用于生成的形状？我尝试过使用border-image，但这只会使它失去我所能管
浏览 0提问于2017-03-23得票数 4
2回答
操纵重复线性渐变
、、、
我想重新创建一个类似于uber品牌网站的线条模式： --特别是你可以在背景中看到的重复线条：
为此，我想到了在css中使用重复线性渐变。
.container {
background-image: repeating-linear-gradient(90deg, #d8d8d8, #d8d8d8 1px, white 0, white 16.666666667%);
min-height: 5000px;
max-width:904px;
margin:0 auto;
}
<div class="container">
&l
浏览 2提问于2017-04-07得票数 2
1回答
我正在Xamarin.Forms中制作一个定制的渐变工具栏，我希望它开始在版本的状态栏下显示。我尝试使用渐变颜色中的第一颜色作为状态栏颜色，但是太大了，无法感觉到渐变。我也尝试使窗口全屏，但它删除了我需要查看的所有状态图标。
上面是我想要的样子
浏览 1提问于2018-07-02得票数 0
2回答
我知道在IE9中设置伪元素的CSS渐变的解决方案吗？
这是我的方法：
似乎过滤器不适用于伪元素，或者我遗漏了什么？
浏览 3提问于2011-09-28得票数 1
回答已采纳
1回答
我有一个HTML表和第一个上面的<tr>，它有一个简单的渐变#ffffff -> #dddddd
是否可以使用css在表上设置圆角边框？
它现在环绕边界，但由于<TR class='my_gradient'>，它把两个尖锐的角落在表的上部。我怎么才能把那个尖角转过来呢？
浏览 2提问于2014-09-08得票数 0
回答已采纳
1回答
我在一个横跨浏览器的网站上使用CSS渐变。不幸的是，您可以看到条带。
我知道在Photoshop这样的图形程序中，你可以对渐变应用抖动，从而平滑渐变。
有没有什么方法可以使用额外的CSS或Javascript将抖动应用到CSS渐变？
浏览 3提问于2014-09-08得票数 0
可见问题：
问题：响应/移动视图
最近，我在一个论坛上添加了一个CSS类，以便将文本颜色更改为四点渐变。
彩色渐变效果很好，但它破坏了文本其余部分的表现。最明显的移动-文本不清晰地断线(如果有的话)，线的高度是不一致的主题h1/h2/h3等预设，而且通常是难以辨认的。
在一个完美的世界中，我只想要渐变颜色覆盖，就像使用规则，以便其他文本设置应用全局主题/元素文本样式，但我找不到渐变规则。
我试过分词和换词规则，但都没有用。
下面是应用的CSS：
.rainbowtxt {
background-image: -webkit-linear-gradient(left, #5cb6ea,
浏览 1提问于2021-05-21得票数 1
2回答
我只是在css中使用线性渐变，顺便说一下，生成的渐变效果与设计不同。我从未在安卓、iOS、React Native或HTML5 canvas中遇到过这个问题，但只在css上遇到过。
.gradient {
background-image: linear-gradient(to right top, red, blue);
}
我已经弄清楚了css的linear-gradient和canvas的create createLinearGradient之间的区别。请检查此。
上面是css渐变，下面是画布渐变。正如你所看到的，画布的createLinearGradient运行良好，但是
浏览 0提问于2019-08-28得票数 1
假设我的线性CSS渐变如下所示：
background: linear-gradient(to right, red 0%, green 20%, blue 40%, purple 60%, yellow 80%, black 100%)
它将生成如下所示的CSS渐变：
如何制作相同的渐变，但使用纯色，而不是在颜色之间过渡？(使用CSS)
类似于下面的内容：
谢谢
浏览 6提问于2017-07-14得票数 13
回答已采纳
2回答
我想标记浏览器滚动条，就像chrome在Control +F中做的那样，只使用html、css和js。
我试过了
放置css位置固定的div
创建滚动条轨迹的线性渐变样式
但在这两次尝试中我都迷失了方向。有什么想法吗？
浏览 0提问于2019-06-21得票数 3
1回答
我看到了这个css按钮演示，它使用png进行渐变覆盖。
png渐变的好处是您可以轻松地分别更改按钮或渐变的颜色。
似乎有一种方法可以用CSS来实现这一点。有一个白色的渐变背景和一个单独的纯色背景在它后面？
浏览 1提问于2018-01-07得票数 1
回答已采纳
3回答
下面是我尝试用CSS渐变构建的按钮渐变：
这通常很容易做到，但正如你所看到的，顶部的渐变看起来更像是一个大的径向渐变，因为它在中间稍微向下倾斜，而不是一直延伸到边缘。
那么，有没有什么办法用CSS做到这一点呢？
浏览 12提问于2010-12-23得票数 4
回答已采纳
4回答
CSS渐变...意见？
、、、
我已经设计了很长一段时间的网站，只是使用图像的渐变，对于小的渐变，这似乎工作得很好，不会增加太多的加载时间，但现在有这么多的碎片与更新的CSS (webkit/moz/o/khtml，更不用说ie6，7，8，9)
因此，为了只有一个通用的渐变，将会有很多css。
对于需要大量渐变的站点，我使用Less.js使其稍有改进，但这仅限于此……
我只是想知道在多大的尺寸上使用css渐变对图像更有意义，如果真的有一个转折点。
例如。一个小的5px的渐变，只有一个5px的图像更有意义，但是像1000px的渐变一样，只使用css可能更有意义。
哦，我知道有SVG，我还没有真正尝试过，但是它工作得好吗？
如有
浏览 2提问于2011-07-16得票数 8
回答已采纳
我正在建立一个主要活动的应用程序，其中UI看起来像电视遥控器。我需要显示交互式响应给用户时，他通过点击与UI交互。
UI是使用Illustrator创建的。我在搜索一些SVG解决方案，但只找到了动画和变形库。原来我需要重新加载部分UI，因为在每次点击时重新加载所有内容似乎对性能有很大影响。
对于这个问题有什么好的解决方案？在部件中加载SVG，并将其与css放在一起？如果没有办法，我甚至在考虑迁移到原生Android，因为我的应用程序依赖于一些手机硬件控制。顺便说一句，我也会将设计转移到Adobe XD来创建原型，所以可能会有一些事情可以让生活变得更容易。
浏览 1提问于2020-11-13得票数 0
1回答
我已经尝试了前面在其他问题中提到的一些修复，但无法使其工作。我在ultimate中使用了css背景渐变生成器，但渐变只在页面的一半处出现。页面为www.ncentertain.com，css文件为ncentertain.con/style14.css
对我做错了什么有什么想法吗？一种解决方案是将渐变放在"html“而不是"body”css中，但似乎行不通。
谢谢!
浏览 7提问于2013-12-29得票数 0
IE的filter CSS属性(IE8中的-ms-filter)允许你做CSS渐变，有点像-webkit-gradient和-moz-gradient属性(参见)。
然而，语法似乎不允许rgba颜色，所以你不能从颜色到透明的渐变。
有没有办法在IE中实现以透明结尾的渐变？
浏览 3提问于2011-03-02得票数 3
回答已采纳
如何实现这种多颜色
使用css3渐变？我见过他们使用css3渐变完成的，并且他们只有一个div来表示多种颜色。
浏览 2提问于2013-02-11得票数 0
回答已采纳
我设计了一个透明度很高的页面。它的一些部分使用了半透明的CSS3渐变。现在这些渐变效果很好，但是火狐对它们和jQuery有问题。如果存在半透明的CSS3渐变，则页面上的大多数jQuery动画都会变得不稳定。
有没有什么jQuery方法可以生成渐变？这将有助于消除firefox中动画的波动性吗？
浏览 3提问于2012-08-13得票数 2
回答已采纳
1回答
我试图得到一个元素顶部和底部的线性渐变。
这是HTML和CSS代码：
CSS：
.content {background: -webkit-gradient(linear, center bottom, center top, from(#f5f5f5), to(#fff)); }
.separator {
height:1px;
border-bottom:1px solid #ebebeb;
}
HTML：
<div class="content">
</div>
<div class="separator
浏览 2提问于2012-11-27得票数 2
回答已采纳
我在InkScape中创建了一个流程图，其中每个形状都填充了一个线性梯度。
有些形状具有相同的渐变色调，但当我通过复制创建它们时&过去不知道在编辑过程中可以转换渐变，我认为复制和粘贴形状只是复制整个对象和每种颜色。
无论如何，它导致形状改变背景梯度在重新定位。经过几次搜索，我发现这是由于每个工具的“梯度编辑器工具”的错误位置造成的。换句话说，我移动了对象，但是每个渐变的开始/结束仍然在原地。
请问，如何快速地重新定位每个形状的渐变方向/开始/结束，可能在每个形状上对其进行中心化？我会避免手动重新定位每一个..。
谢谢
浏览 5提问于2017-03-01得票数 1
1回答
我正在寻找离开，以加快我的移动网站。
一种方法是删除巨大的渐变横幅-使用css，如“显示无”和“可见性隐藏”将不会停止图像加载到后端。
从我能说的来看。谷歌速度测试也显示横幅仍在加载中。
我还尝试了jquery将该div的内容replacewith为空，这在视觉上是有效的。但是图像仍然需要在代码背景中加载。谷歌仍然报告了同样的图片加载。我猜div只创建了一毫秒，然后jquery就开始工作了？
浏览 0提问于2014-05-17得票数 0
我是个新手，在做自己的CSS更改时，我有点纠结于select元素。到目前为止，我使用以下CSS将它放在我想要的位置：
select {
float: left;
border: 0 none;
height: 46px;
width: 240px;
background-color: #191919;
font-size: 14px;
color: white;
}
唯一的问题是，我现在看到了某种类型的渐变，我似乎在CSS中找不到任何东西来消除它。
下面是我所看到的
浏览 0提问于2011-11-20得票数 1
回答已采纳
1回答
我正在构建一个颜色选择器，它使用CSS梯度代替图像。我有一个用于HSB颜色选择的CSS渐变，但我无法创建用于HSB颜色选择的CSS渐变。您可以在以下位置查看原始渐变：
渐变1应该看起来像渐变2。是否可以只使用css？我尝试了几种方法，包括径向梯度，但没有成功。
下面是我使用的css和标记：
#red_grad {
background: -moz-linear-gradient(0deg, rgba(255, 255, 255, 1), rgba(255, 0, 0, 1)) repeat scroll 0 0 transparent;
background: -webkit-
浏览 0提问于2011-01-10得票数 1
回答已采纳
1回答
我想指定一个SVG线性渐变，以精确地复制CSS线性渐变行为。例如，在CSS渐变中，您可以指定渐变的起点和终点分别位于框的左上角和右下角。当框调整大小时，背景渐变会自动适应新的大小。
在我的第一次尝试中，我用SVG复制了一个CSS线性渐变，通过指定一个角度，并根据框的大小计算x1，y1，x2，y2坐标。但如果调整了框的大小，则渐变的角度不会改变，也不再正确。(我必须重新计算所有的坐标)。
我的下一个尝试是使用变换来旋转渐变。下面是一些代码：
<svg xmlns="http://www.w3.org/2000/svg" width="100%" height
浏览 1提问于2012-02-25得票数 6
回答已采纳
6回答
有谁知道支持跨浏览器渐变的jquery css3插件。到目前为止，我看到的所有渐变插件都是基于创建许多元素的。
谢谢。
编辑:很抱歉说得不清楚，我不想让CSS3在不支持它的浏览器上工作。我知道我可以在支持CSS3渐变的浏览器上使用渐变，也可以使用IE过滤器。我正在尝试看看是否有人已经编写了jQuery插件，这样我就可以在代码中做到这一点。
例如，jquery核心对elem.css('opacity', '.5')进行了标准化，这样它就可以跨浏览器工作，而不用考虑不同的语法。也在寻找类似于梯度的东西。
但如果它不存在，我想我还是自己写吧。
浏览 1提问于2010-07-26得票数 4
回答已采纳
我正在开发一款应用程序，它会导致大量的浏览器回流。在这里，性能是一个关键问题。从性能的角度来看，对某些DOM元素使用CSS3渐变还是图像渐变更好？使用CSS文本阴影和渐变的页面与使用图像实现这些视觉效果的页面是否会有较慢的回流速度？另外，有没有我可以使用的回流测试？
浏览 3提问于2010-11-03得票数 1
回答已采纳
10回答
正如标题所述，是否可以在CSS3中创建渐变边框?如果可以，如何创建？我知道你可以制作渐变背景，有很多生成器，但我还没有找到一个为渐变边框创建代码的生成器。
浏览 1提问于2011-07-08得票数 13
回答已采纳
3回答
有没有人知道有没有工具可以获取图像(.png、.gif等)并输出图像包含的渐变？
我真的很想重新创建这个图像
在css中。看起来像是线性和径向渐变的混合，这超出了我的css技能
浏览 1提问于2010-10-03得票数 1
回答已采纳
WebKit引入了创建CSS渐变的功能。例如，使用以下代码：
-webkit-gradient(linear, left top, left bottom, from(#fff), to(#000));
但是，是否可以使用CSS进行不透明渐变？我希望渐变在一边是单一的颜色，在另一边淡出到零不透明度。
跨浏览器兼容性并不重要；我只需要它在Google Chrome中工作。
有没有什么办法可以用CSS做到这一点呢？如果不是，是否可以使用JavaScript (而不是jQuery)来做类似的事情？
谢谢你的帮助。
浏览 1提问于2010-12-19得票数 32
回答已采纳
1回答
我正在尝试使用react-native-linear-gradient来实现一个css类线性渐变的视图，但插件只允许2种颜色它不允许我设置的渐变是径向的，这是css格式的线性渐变linear-gradient(151.76deg, #EE8F62 -43.83%, rgba(239, 203, 113, 0.96) 97.18%, rgba(242, 172, 136, 0.15) 120.83%);，请您我如何才能实现以上与插件，我已经尝试这样做
<LinearGradient colors={[rgba(239, 203, 113, 0.96), rgba(242, 172, 136
浏览 24提问于2018-08-13得票数 2
据我所知，IE9不支持渐变？那么为什么派CSS渐变在IE9中不起作用呢？
浏览 1提问于2011-06-28得票数 0
回答已采纳
2回答
我有以下用于渐变的CSS：
对于IE 8-9
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d7d6d2',]
endColorstr='#f9ffff', GradientType=1);
/* IE 8–9 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#d7d6d2',
endColorstr='#f9ffff', Gradie
浏览 1提问于2013-04-19得票数 1
回答已采纳
我正在使用下面的CSS块来定义一个渐变，该渐变应用于许多不同的背景图像：
.myDiv{
background: linear-gradient(to right, rgba(0,0,0,1) 0%,rgba(0,0,0,0.01) 28%), url(myimage.png);
}
问题是我有大约10个div将使用这个渐变。有没有办法在一个类中定义渐变，在另一个类中定义背景，这样我的代码就不会那么冗长了？我试过了：
.myGradient{
background: linear-gradient(to right, rgba(0,0,0,1) 0%,rgba(0,0,0,0
浏览 4提问于2015-06-07得票数 2
2回答
我想知道是否有人知道，是否有可能只使用CSS创建这样的渐变？我知道可以使用canvas来完成，但是不使用canvas也可以吗？
浏览 0提问于2014-04-04得票数 5
我有一个不能在IE9或更低版本中工作的图像的CSS渐变。我尝试添加一个高度:100%；因为我看到这有助于其他人，但它仍然不影响我的高度。图片是注册按钮，我的网址是。这是CSS
.white {
background: -moz-linear-gradient(center top , #FFFFFF, #DEDCDC) repeat scroll 0 0 transparent;
border: medium none #DEDCDC;
color: #85B700;
margin-left: 5px;}
浏览 1提问于2012-06-07得票数 3
回答已采纳
我对CSS3/SVG按钮有问题。我不知道如何制作这样的线性渐变边界：
顶部按钮:按钮具有透明背景
底部按钮:悬停按钮具有渐变背景(与边框相同)，不透明度为30%，如果您在悬停时无法创建这样的渐变背景，则只能更改边框的颜色
浏览 0提问于2016-04-01得票数 1
3回答
我试图从左侧显示一个白色渐变叠加。线性渐变，从左到右。只有左边是白色的，右边是透明的。使用css可以做到这一点吗？
浏览 31提问于2020-03-04得票数 0
4回答
我有一个java插件，它在我的左边设置一个菜单，然后在右边设置动态数据。单击菜单项时，右侧的相应数据将滚动到顶部。右边的数据是一个很长的列表，当你点击一个菜单项时，你不会只看到一个(单一的)结果，它只是把那个结果带到页面的顶部，其他的在它下面。
所以我想要做的是设置顶部的颜色，以引起注意，这是您要求的结果；对我来说，最好的事情是让它识别您单击的内容并设置背景颜色，但我不知道如何做到这一点，或者编写java，这样如果我可以获得任何帮助将是很好的。
div是移动的，所以我在CSS3中用linear-gradient设置了页面顶部百分比的颜色，但当您单击另一个菜单项时，它就会移开，因为div向上移动
浏览 2提问于2013-06-28得票数 33
1回答
我需要得到一个从正方形到右梯形充满渐变的动画。下面是我所做的：。
#box {
border-bottom: 100px solid transparent;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
height: 0;
width: 50px;
background-origin: border-box;
background-image: -webkit-linear-gradient(blue, yellow);
b
浏览 2提问于2013-03-04得票数 1
回答已采纳
有没有可能用Javascript让CSS3像渐变一样呢？为了跨浏览器的兼容性？CSS3不能在一些浏览器中工作，所以我正在寻找替代方案。如何使用Javascript制作跨浏览器兼容的渐变？线性梯度和径向梯度
浏览 2提问于2016-01-07得票数 1
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM活动推荐
腾讯云开发者
