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

时间:2014-05-24 03:20:52

标签: javascript css html5 twitter-bootstrap twitter-bootstrap-3

我正在尝试使用与此优惠发票输入字段相同的设计 - 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/)中的相似?基本上这个想法是输入字段无缝集成到表单中,您不会看到边框,但只有在您点击它时才会突出显示,当然还可以编辑。

1 个答案:

答案 0 :(得分:0)

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

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