twitter-bootstrap 如何在 twitter bootstrap 中创建只读表单布局
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14598133/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How does one create a read-only form layout in twitter bootstrap
提问by justingordon
Suppose you have view information (not edit information) when using twitter bootstrap. What's the best way to display the data?
假设您在使用 twitter bootstrap 时有查看信息（不是编辑信息）。显示数据的最佳方式是什么？
This was actually brought up as an issue: https://github.com/twitter/bootstrap/issues/4094.
这实际上是作为一个问题提出的：https: //github.com/twitter/bootstrap/issues/4094。
回答by Jess
Bootstrap 3
引导程序 3
BS3 has a concept of a staticfield. You can mix and match static fields and input fields on the same form. Or use all static fields for a read only form.
BS3 有一个静态字段的概念。您可以在同一表单上混合和匹配静态字段和输入字段。或者将所有静态字段用于只读表单。
http://getbootstrap.com/css/#forms-controls-static
http://getbootstrap.com/css/#forms-controls-static
Instead of a normal inputelement, you can use a ptag with this special bootstrap class:
input您可以使用p带有此特殊引导程序类的标记来代替普通元素：
<p class="form-control-static">[email protected]</p>
Bootstrap 4:
引导程序 4：
You can use the form-control-plaintextclass on an inputtag.
您可以form-control-plaintext在input标签上使用该类。
See https://getbootstrap.com/docs/4.0/components/forms/#readonly-plain-text
请参阅https://getbootstrap.com/docs/4.0/components/forms/#readonly-plain-text
回答by justingordon
I went along with MDO's answer on github.
我在 github 上同意了 MDO 的回答。
Here's the example presented above that shows how to do this, using codepen. You can experiment with the styling. Pretty cool tool.
这是上面显示的示例，它显示了如何使用 codepen 执行此操作。您可以尝试样式。很酷的工具。
This also shows how to link to the bootstrap stylesheet in codepen.
这也展示了如何链接到 codepen 中的引导样式表。
