我已经突出了我正在建造的网站的部分，可以正常上色，但是在添加线性梯度颜色时，我正在努力。
我诉诸于将标题的部分放入跨度并为border-bottom着色，这似乎有效，但是边界太远了，无法成为下划线。
编码是：
span {
border-bottom: 5px solid transparent;
border-image: linear-gradient(to right, #7228fe 0%, #4ea2f5 100%);
border-image-slice: 1;
float: center;
margin-bottom: -5px;
line-height: 20px;
padding-bottom: 0px;
}
我建议您将标题放在div中，并使用CSS靶向div。
.box {
border-bottom: 5px solid transparent;
border-image: linear-gradient(to right, #7228fe 0%,#7228fe 60%, #4ea2f5 61%, #4ea2f5 100%);
border-image-slice: 1;
}<html>
<body>
<div class="box">
<h1>box</h1>
</div>
</body>
</html>https://codepen.io/visheshthakur/pen/xzxwwy