css3利用text-shadow属性来实现蚀刻文本，创建文本显示为“蚀刻”或刻在背景中的效果。

效果如下：

我似乎被蚀刻到了背景中

代码实现：

<p class="etched-text">我似乎被蚀刻到了背景中</p>

<style>
.etched-text {
  text-shadow: 0 2px white;
  font-size: 1.5rem;
  font-weight: bold;
  color: #b8bec5;
  backround:#F5F6F9;
}
</styel>

说明：

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

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

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

来源：

30 Seconds of CSS，30秒 CSS 代码片段精选  

本文内容仅供个人学习、研究或参考使用，不构成任何形式的决策建议、专业指导或法律依据。未经授权，禁止任何单位或个人以商业售卖、虚假宣传、侵权传播等非学习研究目的使用本文内容。如需分享或转载，请保留原文来源信息，不得篡改、删减内容或侵犯相关权益。感谢您的理解与支持！

链接: https://fly63.com/article/detial/1357