当前位置: 首页 > 面试题库 >

渐变边框

王辉
2023-03-14
问题内容

我试图将渐变应用于边框,我认为这样做很简单:

border-color: -moz-linear-gradient(top, #555555, #111111);

但这是行不通的。

有人知道做边界渐变的正确方法是什么吗?


问题答案:

WebKit现在(至少Chrome 12)支持渐变作为边框图像:

-webkit-border-image: -webkit-gradient(linear, left top, left bottom, from(#00abeb), to(#fff), color-stop(0.5, #fff), color-stop(0.5, #66cc00)) 21 30 30 21 repeat repeat;

Prooflink- 浏览器支持



 类似资料:
  • 问题内容: 我有以下CSS: 添加边框半径:5px似乎没有任何作用,我认为这是因为我使用的是边框渐变,我是否有办法完全实现所需的5px边框半径? 问题答案: You cannot use with gradient. Here is another idea where you can rely on multiple background and adjust the : 如果需要透明性,可以考

  • 我正在尝试创建一个带有渐变边框的自定义按钮。此时,我得到了在Chrome和Firefox中工作的按钮。 我已经跟随了一个在线指导如何创建一个渐变的自定义边框,也是圆角的。指南的链接可以在这里找到:documentation。 但由于某些原因,相同的样式在Safari中不起作用。我不知道为什么会这样。 这里是我用来创建按钮的CSS代码。我还在底部包含了一个样式相同的片段。请注意,代码段有一些额外的类

  • Another hard-to-write CSS3 feature is a gradient. You have to repeat long gradient definition multiple times with different vendor prefixes. Also, if you want to cover all gradient-supported browsers,

  • 使用渐变填充可以在要应用其他任何颜色时应用渐变颜色混和。创建渐变填色是在一个或多个对象间创建颜色平滑过渡的好方法。您可以将渐变存储为色板,从而便于将渐变应用于多个对象。 注:如果要创建颜色可以沿不同方向顺畅分布的单个多色对象,请使用网格对象。 要查看使用渐变来改进绘画的视频,请参阅 www.adobe.com/go/lrvid4017_ai_cn。有关创建渐变的教程,请参阅 “Unleash th

  • 主要内容:1. 线性渐变,2. 径向渐变,3. 圆锥渐变,4. 重复渐变CSS 中的渐变指的是两种或多种颜色之间的平滑过渡,以前我们必须使用事先定义好的图像来实现渐变效果,在 CSS3 出现以后则简单了很多,CSS3 为实现渐变效果提供了一种灵活的解决方案。 通过 CSS3 您可以定义三种类型的渐变,分别为线性渐变(通过 linear-gradient() 函数创建)、径向渐变(通过 radial-gradient() 函数创建)和圆锥渐变(通过 conic-grad

  • Sketch中的渐变与你熟悉的其它软件有所不同,因为你可以直接在画布中编辑颜色停止点,而不是在检查器中。 要为一个形状增加渐变填充,选中它,然后点击填充(Fill)按钮,检查器就会显示颜色工具。要学习如何设置颜色,请先阅读相关章节。在颜色面板的下面你可以在颜色、渐变或者图案填充之间选择。 点击渐变(Gradient),在出现的弹出菜单中你可以选择线性(Linear)、径向(Radial)和角度(A