基于bootstrap的一些简单实用

最新推荐文章于 2024-06-25 01:34:48 发布

一只小木船

最新推荐文章于 2024-06-25 01:34:48 发布

阅读量359

点赞数

本文链接：https://blog.csdn.net/weixin_41581741/article/details/81624342

版权

<script type="text/javascript" th:src="@{/assets/js/jquery-1.10.2.min.js}"></script>
<link th:href="@{/assets/bootstrap-3.3.5/css/bootstrap.css}" rel="stylesheet" type="text/css"/>

1.div的布局

<body>
<section class="content">
    <div class="form-horizontal">
        <form id="myform">
          <div class="box-body">
           <div class="box box-success">
            <div class="box-header with-border">
                 <h5 class="box-title">信息</h5>
                 <div class="box-tools pull-right">
                 <button type="button" class="btn btn-box-tool" data-widget="collapse"><i
                 class="fa fa-minus"></i></button>
                </div
          
<div class="box-body"> <div class="widget-main"> <div class="row">

<div class="row">
    <div class="col-md-8">
        <div class="form-group">

<label for="sysOrgName" class="control-label col-md-2"><span
        class="red">*</span>工作单位 </label>
<div class="col-md-10">
// form-control 字体的颜色  info[workUnit] 多个vo或实体组合成一个vo 
    <input type="hidden" name="info[workUnit]"  class="form-control" readonly
           th:value="${info.workUnit}"/>
    <input name="sysOrgName" readonly id="sysOrgName" class="form-control" style="width: 770px"
           th:value="${orgName.name}" type="text"/>

<input type="text" class="form-control "  // 反显时间格式 和时间插件
       th:value="${#dates.format(info.time,'yyyy-MM-dd')}"
       id="crtTime" style="width: 275px"
       οnclick="WdatePicker({dateFmt:'yyyy-MM-dd',readOnly:true,isShowClear:false,maxDate:new Date()})"
       name="info[time]"/>

<input type="text" class="form-control " id="firstTime"
       οnchange="editor.bjDate2(this)" style="width: 275px" //设置时间的限制 最大和最小
       onClick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:00',isShowClear:false,readOnly:true,maxDate:'%y-%M-%d' ,minDate:'#F{$dp.$D(\'firstTime\')}'})"
       th:value="${#dates.format(info.firstTime,'yyyy-MM-dd HH:mm:ss')}"
       name="info[firstTime]"/>

<input type="checkbox" value="1"  //checkbox 反显选中
                                            name="info[check]"
                                            th:checked="${info.check== '1'}">

</div>

  </div>
</div>
</div>
</div>
</div>
</div>
 </div>
 </div> 
         </div>
       </form>
    </div>

</section>

2 table

</tr>

</table>

一只小木船

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
基于bootstrap的一些简单实用

&lt;script type="text/javascript" th:src="@{/assets/js/jquery-1.10.2.min.js}"&gt;&lt;/script&gt;&lt;link th:href="@{/assets/bootstrap-3.3.5/css/bootstrap.css}" rel="stylesheet" type="text/c
复制链接

扫一扫