如何在html按钮上添加文本轮廓

Question

我要像这样

任何帮助将不胜感激。

Answer 1

这是Kyle前一段时间针对同一问题提供的解决方案。

boolean

.strokeme
{
    color: white;
    text-shadow:
    -1px -1px 0 #000,
    1px -1px 0 #000,
    -1px 1px 0 #000,
    1px 1px 0 #000;
    
}

Answer 2

您可以添加：

background: -webkit-linear-gradient(-86deg, blue, #Fefefe);
-webkit-background-clip: text;
-webkit-text-stroke: 20px transparent;

输入文字CSS。

Codepen。 https://codepen.io/anon/pen/qyOROr

Answer 3

其他解决方案与我的类似，但我只是在button上添加了CSS

button {
    background: -webkit-linear-gradient(#02bbff, #258eb5);
    color: #fff;
    cursor: pointer;
    font-size: 75px;
    font-weight: bold;
    letter-spacing: 5px;
    text-transform: uppercase;
    -moz-background-clip: text;
    -moz-text-stroke: 15px transparent;
    -webkit-background-clip: text;
    -webkit-text-stroke: 15px transparent; 
}

<button type="button">Enter</button>