移动端兼容

白菜 2023/12/22 移动端

# css 文字渐变

    background: linear-gradient(to bottom, $color);
    -webkit-background: linear-gradient(to bottom, $color);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;

# 在部分 ios 机型上出现竖线

将背景设置为 no-repeat, 并缩小。

    background-repeat: no-repeat;
    background-size: 98% 98%;
    background-position: 50% 50%;

# 在部分 ios 机型上出现渐变字体消失

在 flex 布局下， background-clip 无法生效。