css 边框渐变色

如上图所示，用border实现边框的渐变： 　　先给div添加右边框(或者左边框), border-right: 1px solid #ddd; 　　用border-image设置渐变 bo

... .

如上图所示，用border实现边框的渐变：

　　先给div添加右边框(或者左边框),

.

border-right: 1px solid #ddd;

.

　　用border-image设置渐变

.

border-image: -webkit-linear-gradient(#fff,#000) 20 20;

.

完整的写法：

. . 　<!-- HTML --> .

<view class=‘content‘>   <view>      <image src=‘1.jpg‘></image>      <view>首页</view>   </view>   <view>      <image src=‘2.jpg‘></image>      <view>关于</view>   </view>   <view>      <image src=‘3.jpg‘></image>      <view>成果</view>   </view></view>

. .

.content {  display: flex;  justify-content: space-around;  align-items: center;  text-align: center;  font-size: 24rpx;  color: #fff;}.content > view {  flex-grow: 1;  border-right: 1px solid #ddd;  border-image: -webkit-linear-gradient(#fff,#000) 20 20;}

.

border-image的各个参数详细解析：http://web.jobbole.com/88773/

. .. ...