多行文本渐变的实现

本教程实现一个如下的多行文本渐变的效果：

<span>Singapore:<br>Lion City<br>Lion City<br>Lion City<br>LionCity...</span>

span {
    display: block;
    background: linear-gradient(180deg, #000, #fff);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    padding: 0.5em;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
}

参考

https://codepen.io/rpsthecoder/pen/erBWOE