zoukankan      html  css  js  c++  java
  • bootstrap 3列表单布局

     <form class="form-horizontal" role="form">
                <fieldset>
                    <legend>基础信息</legend>
                    <div class="col-md-4">
                        <div class="form-group">
                            <label class="col-sm-3 control-label">标准类别</label>
                            <div class="col-sm-9">
                                <select class="form-control" style="60%" autocomplete="off" id="cdd_filetype">
                                    <option value="0" selected="selected">食品加工产品</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">名称</label>
                            <div class="col-sm-9">
                                <input class="form-control" style="60%" id="username" type="text" placeholder="" />
                            </div>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="form-group">
                            <label class="col-sm-3 control-label">标准编号</label>
                            <div class="col-sm-9">
                                <input type="text" id="cdd_filename" name="FileName" style="60%" value="GB 9681-88" placeholder="标准编号" class="form-control" required="" />
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">别名</label>
                            <div class="col-sm-9">
                                <input class="form-control" style="60%" id="biename" type="text" placeholder="" />
                            </div>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="form-group">
                            <label class="col-sm-3 control-label">过期时间</label>
                            <div class="col-sm-9">
                                <input type="text" class="layui-input" id="test1" style="auto" placeholder="yyyy-MM-dd">
                            </div>
                        </div>
                    </div>
                </fieldset>
    </form>

    效果图:

  • 相关阅读:
    Rails坑之 gem 'pg', '0.15.1' 安装报错
    Ruby常用文件操作
    Linux各个目录浅析
    Ruby一行代码实现快速排序
    调试常用的方法
    Ruby实现冒泡排序
    Ruby代理例子
    新建一个包,并生成可以直接在命令行执行的指令
    Linux定时任务Crontab命令详解
    php安装完后配置php.ini和php-fpm.conf
  • 原文地址:https://www.cnblogs.com/bin521/p/8427334.html
Copyright © 2011-2022 走看看