Question

我有边框按钮（非div元素）。我需要在按钮的边框上获得渐变色。现在我的按钮看起来像这样（通常就是这样）：

＆＃13;

.uibutton, uibutton:focus {
  width: 120px;
  height: 27px;
  color: #007AFF;
  outline: none;
  border-radius: 3px;
  border-width: 1px;
  border-style: solid;
  border-color: #007AFF;
  background-color: transparent;
}
.uibutton:active {
  width: 120px;
  height: 27px;
  color: #007AFF;
  outline: none;
  border-radius: 3px;
  border-width: 2px;
  border-style: solid;
  background-color: transparent;
}
.uibutton:disabled {
  width: 120px;
  height: 27px;
  color: #C7C7CC;
  outline: none;
  border-radius: 3px;
  border-width: 1px;
  border-color: #C7C7CC;
  border-style: solid;
  background-color: transparent;
}

＆＃13;

<button class="uibutton">Hello World</button>
<button class="uibutton" disabled>Hello World</button>

＆＃13;

我只需要在按钮的边框中使用渐变。我很抱歉，我是白痴，只是我对我的代码感到困惑以及如何编写代码。感谢您的耐心等待。

Answer 1

要在按钮上添加渐变背景，请使用上面的代码或尝试CSS Gradient Generator。

<button class="button solid">My button</button>
<button class="button thin">My button</button>

{{1}}

为非div元素创建渐变边框

1 个答案: