bootstrap label 和 div 显示不在同一条直线上 问题解决

1、问题

在页面显示中，标题 和 内容显示不在同一条直线上；显示不太友好。

2、问题解决

2.1、不友好展示源码

<div class="form-group">
    <label class="col-sm-3 control-label ">姓名:</label>
    <div class="col-sm-5 ">小明</div>
</div>

<div class="form-group">
    <label class="col-sm-3 control-label ">年龄:</label>
    <div class="col-sm-5 ">17</div>
</div>

2.2 解决后的代码

添加 form-control-static 样式：

<div class="form-group">
    <label class="col-sm-3 control-label ">姓名:</label>
    <div class="col-sm-5 form-control-static">小明</div>
</div>

<div class="form-group">
    <label class="col-sm-3 control-label ">年龄:</label>
    <div class="col-sm-5 form-control-static">17</div>
</div>

修改后的页面展示效果：

注：记录工作中遇到的问题及解决方案，大家有更优的解决方案，欢迎补充！