Question

最近我正在开发像 stackoverflow.com 这样的Q＆amp; A网站。但是，当我尝试通过在HTML＆lt; input＆gt;中键入标签的同时为问题添加标签来实现阴影样式时，我感到很困惑。区域。我想知道我应该使用哪些工具来制作我的＆lt; input＆gt;中的每个标记。区域阴影，因为CSS样式在＆lt; input＆gt;中无用区域，怎么做？

下面列出了一个简单的例子，这只是stackoverflow的标签输入区域：

Example

感谢您的帮助。

Answer 1

您可以使用 box-shadow：inset 来实现此目的。如果您想为文本提供阴影，请使用 text-shadow

了解更多信息link。我在下面添加了一个例子。

＆＃13;

input{
  box-shadow:inset 1px 1px 5px #000;
  text-shadow:1px 1px 5px green;
  width:300px;
  height:200px;
  font-size:20px;
  font-weight:400;
  }

＆＃13;

<input type="text">

＆＃13;

Answer 2

<style>
  #yourid{
  box-shadow:inset 0px 5px 5px #666666;
  }
</style>
<input type="text" id="yourid">

Answer 3

使用text-shadow: 0px 2px 2px rgba(255, 255, 255, 0.4);

Answer 4

你需要text-shadow：

input{
     color: white;
    text-shadow: 2px 2px 4px #000000;
}

还可以在此处查看some generators来帮助您

Answer 5

感谢所有的回答者。根据@vsync的提示。我使用Tagify来实现我的需求。该插件完全满足我的要求。

如何为输入区域中输入的标签添加阴影？

5 个答案: