html - 如何在 CSS 中为文本添加两个轮廓

Question

好吧，我最近为 Logo 创建了一个简短的 CSS 代码。我的问题是:添加双轮廓。可能吗？

这是我当前的 CSS:

.green {
  background: -webkit-linear-gradient(#8CE06E, #61964E); /* Gradient colors: Top to Bottom */
  -webkit-text-stroke: 1px 61964E /* Outline weight and color */
  -webkit-background-clip: text; 
  -webkit-text-fill-color: transparent;
  font-size: 43px;
  font-family: Luckiest Guy;
  text-align: center;
}

如您所见，只有一个大纲(第 2 行):

-webkit-text-stroke: 1px 61964E /* Outline weight and color */

我想知道我是否可以添加两个轮廓。第一个是白色的，第二个是绿色的(因为正文是绿色的)。所以，它会是 Text - Outline 1 - Outline 2

例子:

Answer 1

您尝试执行的操作是不可能的，但在某些浏览器中，有一个名为 CSS shapes 的新 CSS 模块。但是，它目前仅适用于 Chrome、Safari 和 Opera，而且它的描述过于宽泛，无法在此处作为答案(而且主要是因为如果不进行一些研究我将不知道如何做)。

Google 搜索“CSS Shapes”，您应该会找到足够多的说明来创建您想要的内容。