如何创建附件中的样式答案

【问题标题】：How to create the style as in the attached如何创建附件中的样式
【发布时间】：2018-10-01 12:28:03
【问题描述】：

我是 CSS 初学者。如何生成 CSS 以生成附件中的阴影效果？

【问题讨论】：

使用text-shadow属性
这种简短且未经研究的帖子获得两次赞成票是最不寻常的。如果您知道有人“有帮助”地支持您的材料作为善意，请让他们停止 - 这有时被视为投票欺诈，并且可能对帐户持有人造成严重后果。

【解决方案1】：

HTML：

<p>
  CUSTOM FRAMING from $99
</p>

CSS：

p {
  -webkit-text-fill-color: rgb(255, 255, 255);
  color: rgb(255, 255, 255);
  -webkit-text-stroke: 1px rgb(150, 150, 150);
  text-shadow: -2px 0px 2px rgb(150, 150, 150);
  font-size: 30px; /* Optional. Just for demo purposes. */
}

以下片段：

p {
  -webkit-text-fill-color: rgb(255, 255, 255);
  color: rgb(255, 255, 255);
  -webkit-text-stroke: 1px rgb(150, 150, 150);
  text-shadow: -2px 0px 2px rgb(150, 150, 150);
  font-size: 30px; /* Optional. Just for demo purposes. */
}

<p>
  CUSTOM FRAMING from $99
</p>

【讨论】：

【解决方案2】：

你可以使用它，你就完成了......

span {
    -webkit-text-fill-color: white; /* Will override color (regardless of order) */
    -webkit-text-stroke-width: 2px;
    -webkit-text-stroke-color: grey;
    text-shadow: -2px -1px 10px rgba(0,0,0,0.6);
}

【讨论】：

【解决方案3】：

使用text-shadow 属性。

这是一个给出内部文本阴影的示例。

font: bold 200px arial, sans-serif;
background-color: #565656;
color: transparent;
text-shadow: 2px 2px 3px rgba(255,255,255,0.5);
-webkit-background-clip: text;
-moz-background-clip: text;
background-clip: text;

Here is an example

【讨论】：