<form class="form-horizontal" role="form">
<fieldset>
<legend>配置数据源</legend>
<div class="form-group">
<label class="col-sm-2 control-label" for="ds_host">主机名</label>
<div class="col-sm-4">
<input class="form-control" id="ds_host" type="text" placeholder="192.168.1.161"/>
</div>
<label class="col-sm-2 control-label" for="ds_name">数据库名</label>
<div class="col-sm-4">
<input class="form-control" id="ds_name" type="text" placeholder="msh"/>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="ds_username">用户名</label>
<div class="col-sm-4">
<input class="form-control" id="ds_username" type="text" placeholder="root"/>
</div>
<label class="col-sm-2 control-label" for="ds_password">密码</label>
<div class="col-sm-4">
<input class="form-control" id="ds_password" type="password" placeholder="123456"/>
</div>
</div>
</fieldset>
<fieldset>
<legend>选择相关表</legend>
<div class="form-group">
<label for="disabledSelect" class="col-sm-2 control-label">表名</label>
<div class="col-sm-10">
<select id="disabledSelect" class="form-control">
<option>禁止选择</option>
<option>禁止选择</option>
</select>
</div>
</div>
</fieldset> <fieldset>
<legend>字段名</legend>
<div class="form-group">
<label for="disabledSelect" class="col-sm-2 control-label">表名</label>
<div class="col-sm-10">
<select id="disabledSelect" class="form-control">
<option>禁止选择</option>
<option>禁止选择</option>
</select>
</div>
</div>
</fieldset>
</form>

Bootstrap表单样式的更多相关文章

  1. bootstrap 表单样式

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. Bootstrap表单

    Bootstrap 提供了下列类型的表单布局: 垂直表单(默认) -> 这个不好看,都是手机版了,PC版占一排不好看: 内联表单 -> 我相信这个才是你想要的,PC版响应横排,手机版响应竖 ...

  3. bootstrap表单带验证

    <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8& ...

  4. 详解Bootstrap表单组件

    表单常见的元素主要包括:文本输入框.下拉选择框.单选框.复选框.文本域.按钮等.下面是不同的bootstrap版本: LESS:  forms.less SASS:  _forms.scss boot ...

  5. 基于Bootstrap表单验证

    基于Bootstrap表单验证 GitHub地址:https://github.com/chentangchun/FormValidate 使用方式: 1.CSS样式 .valierror { bor ...

  6. 第二百三十四节,Bootstrap表单和图片

    Bootstrap表单和图片 学习要点: 1.表单 2.图片 本节课我们主要学习一下 Bootstrap 表单和图片功能,通过内置的 CSS 定义,显示各 种丰富的效果. 一.表单 Bootstrap ...

  7. bootstrapValidator.js,最好用的bootstrap表单验证插件

    前言:做Web开发的我们,表单验证是再常见不过的需求了.友好的错误提示能增加用户体验.博主搜索bootstrap表单验证,搜到的结果大部分都是文中的主题:bootstrapvalidator.今天就来 ...

  8. html5 表单样式 表单验证1 2 3

    html5 表单样式 ie9以下不支持 <!DOCTYPE html> <html lang="en"> <head> <meta cha ...

  9. HTML表单样式

    <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"% ...

随机推荐

  1. tensorboard可视化节点却没有显示图像的解决方法---注意路径问题加中文文件名

    问题:完成graph中的算子,并执行tf.Session后,用tensorboard可视化节点时,没有显示图像 1. tensorboard 1.10 我是将log文件存储在E盘下面的,所以直接在E盘 ...

  2. MySQL操作数据库--与MySQL零距离接触1-7

    第一章 1-7操作数据库 数据库是一个集合:表 索引等. MySQL语句规范: 关键字与函数名称全部大写 数据库名称.表名称.字段名称全部小写 SQL语句必须以分号结尾 语法结构:       {}: ...

  3. 第一次使用theos自己遇到的坑

    这里自己遇到的一些问题,总结一下: 第一个问题建立好theos工程后make出现 xcrun: error: SDK "iphoneos" cannot be located xc ...

  4. vue+element-ui中的表单验证(电话等等)

    1. 2. 3. ============================================================上代码============================ ...

  5. System.Data.Entity.Core.EntityException: The underlying provider failed on Open. ---> System.InvalidOperationException: 超时时间已到。超时时间已到,但是尚未从池中获取连接。出现这种情况可能是因为所有池连接均在使用,并且达到了最大池大小。

    2017/8/15 20:55:21 [AgentPayQuery_205506102_1BBBB]系统异常:System.Data.Entity.Core.EntityException: The ...

  6. python+selenium入门

    from selenium import webdriver打开浏览器 driver = webdriver.Chrome() 打开网页 driver.get("http://www.bai ...

  7. docker中crontab无法执行

    1.下载的镜像是ubuntu最简版,默认没有安装crontab 2.业务需求需要crontab 最早解决方案 1.在宿主机里面 1 3  * * * root  cd /data/wwwroot/xx ...

  8. python 爬起点目录

    #目标:书名,简介,作者,字数 #首先确定源代码的列表 import urllib.request import re from bs4 import BeautifulSoup import ran ...

  9. poj3074 DLX精确覆盖

    题意:解数独 分析: 完整的数独有四个充要条件: 1.每个格子都有填数字 2.每列都有1~9中的每个数字 3.每行都有1~9中的每个数字 4.每个9宫格都有1~9中的每个数字 可以转化成精确覆盖问题. ...

  10. win10 在任务栏添加 desktop 快捷图标

    http://www.xitongcheng.com/jiaocheng/win10_article_11980.html [Shell] Command= IconFile=explorer.exe ...