如何垂直分割2种颜色的文本？

Question

我希望我的div中的一个单词可以使用纯CSS垂直分成2种颜色，任何想法我怎么能这样做？

Answer 1

你当然可以使用CSS3渐变和剪辑属性..我知道我用过的webkits，但不确定其他浏览器，如果你想要你可以试试这个

Demo（请在Chrome上查看）

div {
  font: 40px Arial;
  background: -webkit-linear-gradient(top, #0d2172 0%,#0d2172 50%,#ff2828 50%,#ff0000 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

  

注意：如果您知道，作为Web开发人员，我们不使用任何最新的浏览器   任何工作相同的专有财产请随时编辑   我的回答