0

在此处输入图像描述

在上面你可以看到我应该得到什么结果:

  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元素,但它就像您所看到的那样工作。如果您需要更多信息,请告诉我!

4

0 回答 0