0

我正在为 Bootstrap 使用 Material Design,我想更改一个 textarea 以使其所有边框都可以使用渐变,而不是仅使用底部边框。

我已经开始更改类is-focused,但我无法正确实现所有效果。

有任何想法吗?

4

1 回答 1

0

Bootstrap 材料设计使用窄背景图像作为底部边框。

创建沿元素边界运行的渐变背景图像会很棘手。反而。您可以尝试为边框本身设置动画,例如:

.form-group textarea {
  border: 2px solid #D2D2D2;
  transition: border-color 1s;
  background-image:none;
}
.is-focused textarea {
  border: 3px solid #009688;
}

Codepen 演示

于 2016-05-12T05:45:28.077 回答