Bootstrap 提供了下列类型的表单布局：垂直表单（默认）内联表单 水平表单 项目中的表单为垂直表单
项目展示
项目代码 <form> <div> <label for="exampleInputEmail1">title</label> <input type="textarea" > </div> <div> <label for="exampleInputEmail1">abstract</label> <textarea type="textarea" row="5"></textarea> </div> <div> <label for="exampleInputEmail1">typeandname</label> <input type="textarea" > </div> <div> <label for="exampleInputEmail1">keywords</label> <input type="textarea" > </div> <div> <label for="exampleInputEmail1">releasetime</label> <input type="textarea" > </div> <div> <label for="exampleInputEmail1">link</label> </div> </form>
将表单放置于 .navbar-form 之内可以呈现很好的垂直对齐，并在较窄的视口（viewport）中呈现折叠状态。 使用对齐选项可以规定其在导航条上出现的位置。
注意，.navbar-form 和 .form-inline 的大部分代码都一样，内部实现使用了 mixin。 某些表单组件，例如输入框组，可能需要设置一个固定宽度，从而在导航条内有合适的展现。
单独的表单控件会被自动赋予一些全局样式。所有设置了 .form-control 类的 <input>、<textarea> 和 <select> 元素都将被默认设置宽度属性为 width: 100%;。 将 label 元素和前面提到的控件包裹在 .form-group 中可以获得最好的排列。
心得
表单在我们的项目中占据很大一部分比重，为我们的数据输入和文本提供了模型和传入方式。
bootstrap是一个十分好用的框架，帮助我们解决了不少的问题，少走了许多弯路，可以和vue共同使用，提高我们的编程能力和解决问题的能力。
参考资料菜鸟教程
Bootstrap官方文档