在上面你可以看到我应该得到什么结果:
width: 224px;
height: 36px;
border-radius: 50px;
border-style: solid;
border-width: 1px;
border-image-source: linear-gradient(to left, #7c7c7c, #e1e1e1 51%, #7c7c7c);
border-image-slice: 1;
background-image: linear-gradient(99deg, rgba(71, 71, 71, 0.4) 2%, #2e2e2e), linear-gradient(to left, #7c7c7c, #e1e1e1 51%, #7c7c7c);
background-origin: border-box;
background-clip: content-box, border-box;
在这里你可以看到按钮的样式
text-shadow: 0 2px 1px rgba(0, 0, 0, 0.2);
background-image: linear-gradient(to bottom, var(--white) 40%, #a5a5a5 58%, #8e8e8e 64%);
font-family: Montserrat;
font-size: 12px;
font-weight: normal;
font-stretch: normal;
font-style: normal;
line-height: 1.33;
letter-spacing: 1px;
text-align: center;
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
在这里你可以看到文本的样式
这是我的结果
https://jsfiddle.net/cezLu5fg/
在这里你可以在小提琴中看到我的代码。我真的不明白出了什么问题我做错了什么?以及如何发现它?我认为我们zeplin
为此目的提供了正确的样式,我们可以将其应用于我们的css
元素,但它就像您所看到的那样工作。如果您需要更多信息,请告诉我!