css 创建文本显示为“蚀刻”或刻在背景中的效果。

>>> 点击查看演示

HTML

<p class="etched-text">I appear etched into the background.</p>

CSS

.etched-text {
  text-shadow: 0 2px white;
  font-size: 1.5rem;
  font-weight: bold;
  color: #b8bec5;
}

说明 text-shadow: 0 2px white 创建白色阴影偏移0px 水平和2px 垂直于原点位置。

背景必须比阴影暗，效果才能发挥作用。

文字颜色应该稍微褪色，使其看起来像是刻在背景上的。