-webkit-在文本修饰

Question

我有transition淡入/淡出我带下划线的text-decoration。它在每个浏览器上都可以完美，而除了在Safari上没有进行淡入/淡出过渡。
我已添加-webkit-，如MDN所示，以使其适用于Safari，但它似乎无法解决问题（我无法使用border-bottom）。

这是我的CSS：

＆＃13;

＆＃13;

.posts a:link {
  text-decoration: underline solid transparent;
  transition: text-decoration 0.3s ease;
  -webkit-transition: text-decoration 0.3s ease;
}

.posts a:hover {
  text-decoration-color: black;
}

＆＃13;

＆＃13;

＆＃13;