bootstrap表单类型
1.基本格式
<form><div class="form-group"><label>电子邮件</label><input type="email" class="form-control" placeholder="请输入你的电子邮件" /></div><div class="form-group"><label>密码</label><input type="password" class="form-control" placeholder="请输入你的密码" /></div></form>
2、内联表单
<form class="form-inline"><div class="form-group"><label>电子邮件</label><input type="email" class="form-control" placeholder="请输入你的电子邮件" /></div></form><br />
3.表单合组(前后增加片段input-group-addon)
<form class="form-inline"><div class="input-group"><div class="input-group-addon">¥</div><input type="text" class="form-control"><div class="input-group-addon">.00</div></div></form><br />
4、水平排列
<form class="form-horizontal"><div class="form-group"><label class="col-sm-2 control-label">电子邮件</label><div class="col-sm-10"><input type="email" class="form-control" placeholder="请输入您的电子邮件"></div></div></form>
5、复选框
<!--默认设置复选框--><div class="checkbox"><label><input type="checkbox" />体育</label></div><div class="checkbox"><label><input type="checkbox" />音乐</label></div><!--设置禁用的复选框--><div class="checkbox disabled"><label><input type="checkbox" disabled/>体育</label></div><!--设置内联一行显示的复选框--><div class="checkbox checkbox-inline"><label><input type="checkbox" />音乐</label></div><div class="checkbox checkbox-inline"><label><input type="checkbox" />体育</label></div>
6、单选框
<div class="radio "><label><input type="radio" name="sex" />男</label></div>
![]()
7、下拉列表
<select class="form-control"><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option></select>

8、校验状态
<!--label 标签同步相应状态--><!--1.has-error;2.has-success;3.has-warning;--><div class="form-group has-success"><label class="control-label">Input with success</label></div>
![]()
9、设置额外的图标
<div class="form-group has-feedback"><label>电子邮件</label><input type="email" class="form-control"><!--成功状态 --><span class="glyphicon glyphicon-ok form-control-feedback"></span></div><div class="form-group has-feedback"><label>电子邮件</label><input type="email" class="form-control"><!--警告状态 --><span class="glyphicon glyphicon-warning-sign form-control-feedback"></span></div><div class="form-group has-feedback"><label>电子邮件</label><input type="email" class="form-control"><!--错误状态 --><span class="glyphicon glyphicon-remove form-control-feedback"></span></div>

10、控制尺寸
<input type="text" class="form-control input-lg" value="大输入框"><br /><input type="text" class="form-control" value="默认"><br /><input type="text" class="form-control input-sm" value="小输入框">

相关文章:
bootstrap表单类型
1.基本格式 <form><div class"form-group"><label>电子邮件</label><input type"email" class"form-control" placeholder"请输入你的电子邮件" /></div><div class"form-group"&g…...
第一章 SQL Server 数据库部署
个人简介:云计算网络运维专业人员,了解运维知识,掌握TCP/IP协议,每天分享网络运维知识与技能。座右铭:海不辞水,故能成其大;山不辞石,故能成其高。 个人主页:小李会科技的…...
赛事个人团体报名分组成绩查询证书h5小程序开源版开发
赛事个人团体报名分组成绩查询证书h5小程序开源版开发 以下是赛事个人团体报名分组成绩查询证书H5小程序的功能列表: 用户注册和登录:用户可以通过注册和登录功能创建账号或使用已有账号登录小程序。 赛事信息浏览:用户可以浏览小程序中提供…...
【大数据环境配置】01-安装VMware虚拟机
一、VMware的安装 1: 运行“VMware_workstation_full_12.5.2.exe”(或者其他版本) 2:引导页面,直接点击下一步 3: 同意许可,然后继续点击下一步 4: 选择VMware安装位置࿰…...
什么是C语言中的命名空间?
C语言本身并没有像某些其他编程语言(如C)中的显式命名空间(namespace)的概念,但C语言中有一些机制和约定,允许开发人员组织和管理变量、函数和其他标识符的名称,以避免名称冲突和提高代码可维护…...
Java语言特点 8种基本数据类型 标识符等练习题 插入/希尔/选择/堆/冒泡/快速/归并/计数排序
(单选题)java 的字符类型采用的是 Unicode编码方案,每个 Unicode码占用( )个比特位。 题目内容: A .8 B .16 C .32 D .64 (单选题)下列说法不正确的是( ࿰…...
建站系列(七)--- 常用前后端框架
目录 相关系列文章前言一、何为框架?二、为什么使用框架三、常用框架(一)Bootstrap(二)Layui(三)JQuery(四)Vue.js(四)ThinkPHP(五&am…...
Jmx协议远程连接java服务器
注意:本例里,我用的是jdk17 通常用jdk自带的jconsole,或者想要功能强大点的使用visualVM 需要java服务器在启动的时候加上以下参数 -Dcom.sun.management.jmxremote 启用jxm远程连接-Djava.rmi.server.hostname10.1.3.99 指定jxm监听地址&…...
consul 概念 键值对操作命令
传统配置文件的弊端 静态化配置,例如env文件配置文件无法区分环境配置文件过于分散历史版本无法查看 配置中心如何解决的呢?配置中心的思路是把项目中的配置参数全部放在一个集中的地方来管理,并提供一套标准的接口,当各个服务需要获取配置…...
R拒绝访问的解决方案
Win11系统 安装rms的时候报错: Error in loadNamespace(j <- i[[1L]], c(lib.loc, .libPaths()), versionCheck vI[[j]]) : namespace Matrix 1.5-4.1 is already loaded, but > 1.6.0 is required## 安装rms的时候报错,显示Matrix的版本太低…...
SeaArt.ai: 海艺AI绘画艺术图片模型创作平台
【产品介绍】 • 名称 SeaArt.ai • 具体描述 SeaArt.ai是一个基于人工智能技术的AI绘画工具,它可以根据你的描述或者关键词来生成符合你想象的图片。你可以选择不同的模式来创建不同类型的图片,比如人物、风景、建筑、神话、自…...
服务器数据恢复-Xen server虚拟机数据恢复案例
服务器数据恢复环境: 一台某品牌服务器通过一张同品牌某型号RAID卡将4块STAT硬盘组建为一组RAID10阵列。上层部署Xen Server虚拟化平台,虚拟机上安装的是Windows Server操作系统,包括系统盘 数据盘两个虚拟机磁盘,作为Web服务器使…...
电工-PN结的工作原理
如果将PN结加正向电压,即P区接正极,N区接负极,如右图所示。由于外加电压的电场方向和PN结内电场方向相反。在外电场的作用下,内电场将会被削弱,使得阻挡层变窄,扩散运动因此增强。这样多数载流子将在外电场…...
C#教学辅助系统网站as.net+sqlserver
本教学辅助系统系统从两种用户角度进行功能划分。 1、学生部分: 1.1:新闻查看; 1.2:课程公告查看; 1.3:用户注册; 1.4:在线留言; 1.5:资料下载; …...
Selenium - Tracy 小笔记2
selenium本身是一个自动化测试工具。 它可以让python代码调用浏览器。并获取到浏览器中加们可以利用selenium提供的各项功能。帮助我们完成数据的抓取。它容易被网站识别到,所以有些网站爬不到。 它没有逻辑,只有相应的函数,直接搜索即可 …...
SVN 和 GIT 命令对比
参考 https://blog.csdn.net/justry_deng/article/details/82259470 # TortoiseSVN打分支、合并分支、切换分支 https://www.huliujia.com/blog/802a64152bbbe877c95c84ef2fdf3857a056b536/ # 版本控制:Git与Svn的命令对应关系 TortoiseSVN打分支、合并分支、切换…...
LeetCode 之 移除元素
算法模拟: Algorithm Visualizer 在线工具: C 在线工具 如果习惯性使用Visual Studio Code进行编译运行,需要C11特性的支持,可参考博客: VisualStudio Code 支持C11插件配置 问题1:LeetCode 27.移除元素…...
Leecode1160: 拼写单词
直接使用一个哈希表存整体的结果,一个临时的哈希表每次算一遍,但是1是要设置标志位来判断最后是否正确并加上长度,2是千万要记得每次新建一个空间来存哈希表绝对不能不空间就等于,会出事!!...
电脑死机的时候,CPU到底在做什么?
电脑死机,应该每个接触计算机的小伙伴都经历过吧。 尤其是早些年,电脑配置还没现在这么高的时候,多开几个重量级应用程序,死机就能如约而至,就算你把键盘上的CTRLALTDELETE按烂了,任务管理器也出不来&…...
jdk 中的 keytool 的使用,以及提取 jks 文件中的公钥和私钥
这里暂时只需要知道如何使用就可以了。 首先是生成一个密钥, keytool -genkeypair -alias fanyfull -keypass ffkp123456 -validity 365 -storepass ffsp123456 -keystore fanyfull.jks -keyalg RSA解释一下这里的选项, -alias 密钥对的名称-keypass …...
观成科技:隐蔽隧道工具Ligolo-ng加密流量分析
1.工具介绍 Ligolo-ng是一款由go编写的高效隧道工具,该工具基于TUN接口实现其功能,利用反向TCP/TLS连接建立一条隐蔽的通信信道,支持使用Let’s Encrypt自动生成证书。Ligolo-ng的通信隐蔽性体现在其支持多种连接方式,适应复杂网…...
【android bluetooth 框架分析 04】【bt-framework 层详解 1】【BluetoothProperties介绍】
1. BluetoothProperties介绍 libsysprop/srcs/android/sysprop/BluetoothProperties.sysprop BluetoothProperties.sysprop 是 Android AOSP 中的一种 系统属性定义文件(System Property Definition File),用于声明和管理 Bluetooth 模块相…...
【Oracle】分区表
个人主页:Guiat 归属专栏:Oracle 文章目录 1. 分区表基础概述1.1 分区表的概念与优势1.2 分区类型概览1.3 分区表的工作原理 2. 范围分区 (RANGE Partitioning)2.1 基础范围分区2.1.1 按日期范围分区2.1.2 按数值范围分区 2.2 间隔分区 (INTERVAL Partit…...
精益数据分析(97/126):邮件营销与用户参与度的关键指标优化指南
精益数据分析(97/126):邮件营销与用户参与度的关键指标优化指南 在数字化营销时代,邮件列表效度、用户参与度和网站性能等指标往往决定着创业公司的增长成败。今天,我们将深入解析邮件打开率、网站可用性、页面参与时…...
智能分布式爬虫的数据处理流水线优化:基于深度强化学习的数据质量控制
在数字化浪潮席卷全球的今天,数据已成为企业和研究机构的核心资产。智能分布式爬虫作为高效的数据采集工具,在大规模数据获取中发挥着关键作用。然而,传统的数据处理流水线在面对复杂多变的网络环境和海量异构数据时,常出现数据质…...
Cilium动手实验室: 精通之旅---13.Cilium LoadBalancer IPAM and L2 Service Announcement
Cilium动手实验室: 精通之旅---13.Cilium LoadBalancer IPAM and L2 Service Announcement 1. LAB环境2. L2公告策略2.1 部署Death Star2.2 访问服务2.3 部署L2公告策略2.4 服务宣告 3. 可视化 ARP 流量3.1 部署新服务3.2 准备可视化3.3 再次请求 4. 自动IPAM4.1 IPAM Pool4.2 …...
MFE(微前端) Module Federation:Webpack.config.js文件中每个属性的含义解释
以Module Federation 插件详为例,Webpack.config.js它可能的配置和含义如下: 前言 Module Federation 的Webpack.config.js核心配置包括: name filename(定义应用标识) remotes(引用远程模块࿰…...
全面解析数据库:从基础概念到前沿应用
在数字化时代,数据已成为企业和社会发展的核心资产,而数据库作为存储、管理和处理数据的关键工具,在各个领域发挥着举足轻重的作用。从电商平台的商品信息管理,到社交网络的用户数据存储,再到金融行业的交易记录处理&a…...
ui框架-文件列表展示
ui框架-文件列表展示 介绍 UI框架的文件列表展示组件,可以展示文件夹,支持列表展示和图标展示模式。组件提供了丰富的功能和可配置选项,适用于文件管理、文件上传等场景。 功能特性 支持列表模式和网格模式的切换展示支持文件和文件夹的层…...
2.3 物理层设备
在这个视频中,我们要学习工作在物理层的两种网络设备,分别是中继器和集线器。首先来看中继器。在计算机网络中两个节点之间,需要通过物理传输媒体或者说物理传输介质进行连接。像同轴电缆、双绞线就是典型的传输介质,假设A节点要给…...
