CSS的凸版效果 [英] Letterpress effect with CSS

问题描述

我想要这样的活版效果：

在CSS。

I want to make a letterpress effect like this: in CSS. but I can't seem to find the right text-shadow for it.

这个词的颜色：＃2f4050
背景颜色：＃4f6478

Color of the word: #2f4050 Color of the background: #4f6478

我尝试过：

.letterpress {
    color:#2f4050;
    font-family:Tahoma, Helvetica, Arial, sans-serif;
    font-size:70px;
    font-style:normal;
    font-variant:normal;
    font-weight:normal;
    line-height:normal;
    text-align:center;
    text-shadow:#4f6478 0 1px 5px; 
}

但这似乎并不好。

推荐答案

.letterpress {
    color:#2f4050;
    font-family:Tahoma, Helvetica, Arial, sans-serif;
    font-size:70px;
    text-align:center;
    text-shadow: 0 1px 1px #fff; 
}

Btw。您不必声明正常值对

That should do it. Btw. you don't have to declare the "normal" value pairs

这篇关于CSS的凸版效果的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！