博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
快速设计表单样式
阅读量:6887 次
发布时间:2019-06-27

本文共 1767 字,大约阅读时间需要 5 分钟。

<!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{
width:600px;height:auto;margin-left: auto;margin-right: auto;background-color:#B0E0E6;padding:30px;
}
.innerdiv{
width: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>

转载地址:http://shtbl.baihongyu.com/

你可能感兴趣的文章
Nodejs日志管理log4js
查看>>
python获取昨日日期
查看>>
海康威视 - 萤石云开放平台 js 版
查看>>
关于分销平台
查看>>
剑指offer---12-**--数值的整数次方
查看>>
PAT - L2-010. 排座位(并查集)
查看>>
Python 学习笔记 - 线程(线程锁,信标,事件和条件)
查看>>
大数据技术服务商个推获4亿人民币D轮融资
查看>>
Git的详细使用教程
查看>>
iOS实现类似苹果手机原生的锁屏界面(数字密码)
查看>>
[vue] 表单输入格式化,中文输入法异常
查看>>
Observer观察者模式与OCP开放-封闭原则
查看>>
如何搭建高级工程师知识框架?推荐两种方式
查看>>
BAT的医疗春秋大梦
查看>>
Pulsar本地单机(伪)集群 (裸机安装与docker方式安装) 2.2.0
查看>>
利用H5的css3制作动画
查看>>
Android View 事件分发源码分析
查看>>
vue 2.0 - props
查看>>
RustCon Asia 实录 | Rust 在国内某视频网站的应用
查看>>
Vue遇上Analytics
查看>>