如何將兩個輪廓添加到CSS中的文字

好吧，我最近爲Logos創建了一個簡短的CSS代碼。我的問題是：添加一個雙輪廓。可能嗎？如何將兩個輪廓添加到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 */

我想知道我是否可以添加兩個輪廓。第一個是白色的，第二個是綠色的（因爲正文是綠色的）。因此，這將會是文本 - 概述1 - 2大綱

例子：

來源

2015-10-15 ConnorLx3

您是否嘗試過使用其他邊框顏色添加僞元素：.green：before？檢查這篇文章，https://css-tricks.com/snippets/css/multiple-borders/ –

@small你確實意識到你鏈接的文章與佈局元素有關？ –

這是可能的唯一方法是如果你在CSS中討論box（div）。

來源

2018-01-22 05:34:42 CelticTree

你所要做的是不可能的，但是，在某些瀏覽器，有一個新的名爲CSS模塊CSS形狀。然而，它目前僅適用於Chrome，Safari和Opera，其描述過於寬泛，因此在這裏得到了答案（主要原因是我不知道如何進行某些研究）。

谷歌的「CSS形狀」，你應該找到綽綽有餘的創建你想要的指令。

來源

2015-10-16 00:10:50 Rob

我真的不明白形狀如何幫助我，除非您建議我圍繞我的文本創建自定義CSS形狀以採用雙輪廓的形式？ – ConnorLx3

@ ConnorLx3是的。 – Rob

如何將兩個輪廓添加到CSS中的文字

回答

相關問題