css怎么实现文字描边

有时,我们会遇到UI稿有文字描边的效果,比如下图的效果。
在这里插入图片描述
一、给需要描边的文字加一个id选择器
例如:
在这里插入图片描述
二、css写法:

                    number,
                     {
                        //这个是实现文字描边的关键,也就是‘空心文字’,这个是定义文字字符的描边的宽度和颜色。
                        -webkit-text-stroke: #f4f6f6 10px;
                        color: #276a84;
                        font-family: "FZLT";
                        &::before {
                            content: attr(id);
                            position: absolute;
                            -webkit-text-stroke: 1px;
                            color: #276a84;
                        }
                    }

你可能感兴趣的:(css,前端)