css 如何创建渐变轮廓文本？

cedebl8k 于 2023-04-01 发布在其他

关注(0)|答案(1)|浏览(157)

我试图创建一个花哨的标题，与文本是用渐变色概述。
下面是我的代码，我试过了，但它仍然不起作用：

:root {
    --blue-purp-gradient: linear-gradient(45deg, #ea00ff, #1900ff);
  } /* This is my varibble */ 

h1 {
    font-size: 52px;
    /* background: -webkit-linear-gradient(45deg, #ea00ff, #1900ff); */
    background-size: 200%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: 2px var(--blue-purp-gradient);
}```

css

来源：https://stackoverflow.com/questions/74071497/how-can-i-create-a-gradient-outlined-text

1条答案

按热度按时间

hyrbngr71#

如果不需要透明度，您可以尝试如下操作：

h1 {
    font-size: 100px;
    color: #fff; /* same as background */
    background: linear-gradient(45deg, #ea00ff, #1900ff); 
    background-size: 200%;
    -webkit-background-clip: text;
    -webkit-text-stroke: 4px #0000;

    font-weight: 700;
}

<h1>Some Text</h1>

赞(0）回复(0）举报 2023-04-01

我来回答

css 如何创建渐变轮廓文本？

1条答案

相关问题

热门标签

最新问答