css - 使输入表单不可见

Question

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

Answer 1

您可以使元素透明：

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

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

Answer 2

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

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

Answer 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;
}