Css 如何根据文本的长度应用渐变颜色文本？

我正在使用下面的渐变色文本代码

h3 {
      background: linear-gradient( to right, #D3EDFF ,#FCAAA3 );
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      
}

它的工作，但梯度颜色效果是不同的，在每个文本由于长度的差异

---

如何在不考虑文本长度的情况下应用相同的渐变颜色模式？

这是因为您正在设置的背景位于

中，因此背景

线性渐变

在所有元素中都是相同的

必须将元素的显示更改为

内联块

h3{
背景：线性梯度（向右，D3EDFF为0%，FCAAA3为100%）；
-webkit背景剪辑：文本；
-webkit文本填充颜色：透明；
显示：内联块；
}

测试


测试测试