javascript - Bootstrap 3 文档的无缝输入字段 css

Question

我正在尝试做与这个漂亮的发票输入字段相同的设计 - http://css-tricks.com/examples/EditableInvoice/

但是正如您在我的 Bootstrap 3 表单中看到的那样，输入字段看起来很糟糕。

http://jsfiddle.net/gV6y8/16/

 <input type="text" class="form-control required" value="John Smith">

你可以看到所有带输入框的都有一个可怕的输入框。

如何使其与示例 editableinvoice ( http://css-tricks.com/examples/EditableInvoice/ ) 中的相似？基本上这个想法是将输入字段无缝集成到表单中，您看不到边框，但只有在您单击它时才会突出显示，当然还可以编辑。

Answer 1

您需要通过 CSS 格式化输入字段，如下所示:

.form-control{ border:0;}
.form-control:hover{ background-color: #f00;}