使输入表单不可见答案

【问题标题】：Make input form invisible使输入表单不可见
【发布时间】：2013-11-10 10:44:45
【问题描述】：

我有显示在背景文本图像上的输入表单。我希望输入表单不可见，以便用户可以插入输入，但不会显示白色空白表单，只会显示背景。我尝试了“透明”属性，但它涵盖了表单和背景文本图像。您可以在这里的图像上看到它现在的样子，在另一张图像中看到我想要的样子。谢谢。 这就是我现在的样子： http://i.imgur.com/DsfcD8g.jpg 这就是我想要的： http://i.imgur.com/gaZZzrr.jpg

【问题讨论】：

标签： css html forms input

【解决方案1】：

您可以使元素透明：

form *{
    border: none;
    background-color: transparent;
}

注意：这会将其应用于表单中的所有元素，您需要根据您拥有/想要的内容修改您的选择器

【讨论】：

是的，这就是我在上传图像的第一个表单中所做的，这使得表单和图像透明。
那有什么问题呢？
我希望看到文本图像，请查看我在帖子中添加的第二张图像。现在我那里有白场。
您应该只使背景色透明并将边框设置为无。这样您的文本仍将显示。您是否尝试过我回答中的代码？
我做了，结果和我一样。

【解决方案2】：

我刚刚在 IE5、7、8、9、10、11、Chrome、Safari、FF 和 Opera 上尝试了 Kenneth 的解决方案。一切正常。

你用的是什么浏览器？你能提供一个活生生的例子吗？

【讨论】：

【解决方案3】：

input[type=text],
textarea {
    background: transparent;
    border: none;
}

/* This if you don't want an outline on focus - bad for accessibility */
input[type=text]:focus,
textarea:focus {
    outline: none;
}

【讨论】：