zoukankan      html  css  js  c++  java
  • 快速设计表单样式

    <!DOCTYPE html>
    <html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>后台</title>
        <link href="http://libs.baidu.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
        <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
        <script src="http://libs.baidu.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
    </head>
    <body>

    <style>
    .outdiv{
    600px;height:auto;margin-left: auto;margin-right: auto;background-color:#B0E0E6;padding:30px;
    }
    .innerdiv{
    500px;height:auto;margin-left: auto;margin-right: auto;background-color:#F5F5DC;padding:30px;font-size:15px;font-family:Microsoft YaHei
    }
    </style>
    <div class="outdiv">
        <div class="innerdiv">
        

     
     
     
      <form class="form-horizontal">
        <fieldset>
          <div id="legend" class="">
            <legend class="">添加内容</legend>
          </div>
        <div class="control-group">

              <!-- Text input-->
              <label class="control-label" for="input01">文章标题:</label>
              <div class="controls">
                <input placeholder="请输入文章标题" class="input-xlarge" type="text">
                <p class="help-block"></p>
              </div>
            </div>

       

        <div class="control-group">

              <!-- Select Multiple -->
              <label class="control-label">文章分类:</label>
              <div class="controls">
                <select class="input-xlarge" multiple="multiple">
          <option>新闻</option>
          <option>农业</option>
          <option>三农</option></select>
              </div>
            </div>

        <div class="control-group">

              <!-- Textarea -->
              <label class="control-label">文章正文:</label>
              <div class="controls">
                <div class="textarea">
                      <textarea type="" class=""> </textarea>
                </div>
              </div>
            </div>

        <div class="control-group">
              <label class="control-label">提交文章:</label>

              <!-- Button -->
              <div class="controls">
                <button class="btn btn-success">确认提交</button>
              </div>
            </div>

        </fieldset>
      </form>

    <!--http://www.bootcss.com/p/bootstrap-form-builder/#4-->


     
    </div>
    </div>
    </body>
    </html>

  • 相关阅读:
    记一次bash脚本报错原因
    说说JSON和JSONP,也许你会豁然开朗,含jQuery用例(转载)
    python 正则空格xa0实录 与xpath取 div 里面的含多个标签的所有文字
    python3的时间日期处理
    easyui的 一些经验
    hash是什么?
    vue.js 入门
    python __nonzero__方法
    Jmeter之『并发』
    Docker之网络篇
  • 原文地址:https://www.cnblogs.com/hellowzd/p/4767016.html
Copyright © 2011-2022 走看看