当前位置： 首页 > news >正文

【Bootstrap V4系列】学习入门教程之 组件-输入组（Input group）

news 来源：原创 2025/8/4 3:08:21

Bootstrap V4系列 学习入门教程之 组件-输入组（Input group）

  • 输入组（Input group）
    • Basic example
    • 一、Wrapping 包装
    • 二、Sizing 尺寸
    • 三、Multiple inputs 多输入
    • 四、Multiple addons 多个插件
    • 五、Button addons 按钮插件
    • 六、Buttons with dropdowns 带下拉按钮
    • 七、Custom forms 自定义表单
      • 7.1 Custom select 自定义选择
      • 7.2 Custom file input 自定义文件输入

输入组（Input group）

通过在文本输入、自定义选择和自定义文件输入的任一侧添加文本、按钮或按钮组，可以轻松扩展表单控件。

Basic example

在输入的两侧放置一个插件或按钮。您也可以在输入的两侧放置一个。记住将<label>s放在输入组之外。

<!--Basic example-->
<div class="input-group mb-3">

相关文章：

【Bootstrap V4系列】学习入门教程之 组件-输入组（Input group）

Bootstrap V4系列 学习入门教程之 组件-输入组（Input group） 输入组（Input group）Basic example一、Wrapping 包装二、Sizing 尺寸三、Multiple inputs 多输入四、Multiple addons 多个插件五、Button addons 按钮插件六、Buttons with dropdowns 带下拉按钮七、Custom for…...

编程日记 2025/8/4 3:08:21

图像处理篇--- HTTP｜RTSP｜MJPEG视频流格式

文章目录 前言一、MJPEG (Motion JPEG)基本概念技术特点编码方式传输协议数据格式 优势实现简单低延迟兼容性好容错性强 劣势带宽效率低不支持音频缺乏标准控制 典型应用 二、RTSP (Real Time Streaming Protocol)基本概念技术特点协议栈工作流程传输模式 优势专业流媒体支持高…...

编程日记 2025/7/29 22:57:21

`RotationTransition` 是 Flutter 中的一个动画组件，用于实现旋转动画效果

RotationTransition 是 Flutter 中的一个动画组件&#xff0c;用于实现旋转动画效果。它允许你对子组件进行动态的旋转变换&#xff0c;从而实现平滑的动画效果。RotationTransition 通常与 AnimationController 和 Tween 一起使用&#xff0c;以控制动画的开始、结束和过渡效果…...

编程日记 2025/8/3 10:31:15

养生：开启健康生活的密钥

在快节奏的现代生活中&#xff0c;养生已成为追求健康的重要方式。从饮食、运动到生活习惯&#xff0c;每一个细节都关乎身体的健康。以下为你介绍科学养生的实用方法&#xff0c;助你打造健康生活。 饮食养生&#xff1a;均衡营养&#xff0c;滋养身体 合理的饮食是养生的基…...

编程日记 2025/8/3 1:29:05

大模型微调算法原理：从通用到专用的桥梁

前言 本文聚焦大模型落地中的核心矛盾——理论快速发展与实际应用需求之间的脱节，并系统探讨微调技术作为解决这一矛盾的关键手段。尽管大模型展现出强大的通用能力，但其在垂直领域的直接应用仍面临适配性不足、计算成本高等挑战。微调通过在预训练模型基础上进行针对性优化，…...

编程日记 2025/7/31 23:55:08

引言：Client Hello 为何是 HTTPS 安全的核心？

当用户在浏览器中输入 https:// 时&#xff0c;看似简单的操作背后&#xff0c;隐藏着一场加密通信的“暗战”。Client Hello 作为 TLS 握手的首个消息&#xff0c;不仅决定了后续通信的加密强度&#xff0c;还可能成为攻击者的突破口。据统计&#xff0c;超过 35% 的网站因 TL…...

编程日记 2025/7/30 18:37:01

深度学习中的目标检测：从 PR 曲线到 AP

深度学习中的目标检测&#xff1a;从 PR 曲线到 AP 在目标检测任务中&#xff0c;评估模型的性能是非常重要的。通过使用不同的评估指标和标准&#xff0c;我们可以量化模型的准确性与效果。今天我们将重点讨论 PR 曲线&#xff08;Precision-Recall Curve&#xff09;、平均精…...

编程日记 2025/8/1 17:03:59

测试左移系列-产品经理实战-实战认知1

课程&#xff1a;B站大学 记录产品经理实战项目系统性学习&#xff0c;从产品思维&#xff0c;用户画像&#xff0c;用户体验&#xff0c;增长数据驱动等不同方向理解产品&#xff0c;从0到1去理解产品从需求到落地的全过程&#xff0c;测试左移方向&#xff08;靠近需求、设计…...

编程日记 2025/7/30 12:26:44

数据集-目标检测系列- 烟雾 检测数据集 smoke ＞＞ DataBall

数据集-目标检测系列- 消防 浓烟 检测数据集 smoke>> DataBall 数据集-目标检测系列- 烟雾 检测数据集 smoke &#xff1e;&#xff1e; DataBall * 相关项目 1&#xff09;数据集可视化项目&#xff1a;gitcode: https://gitcode.com/DataBall/DataBall-detections-10…...

编程日记 2025/8/1 20:17:14

概率论与数理统计基础学习大纲

📅 课程规划 阶段一：基础入门（第1-3周） 目标：掌握概率基础和基本分布 核心知识点： 概率论的基本概念：随机事件、样本空间、概率公理条件概率与全概率公式：贝叶斯公式、事件独立性随机变量与分布：离散型和连续型随机变量常见分布： 离散：二项分布、泊松分布连续：…...

编程日记 2025/7/31 17:53:42

5大B2B数字营销社群营销标杆案例TOB企业数字化营销内容营销AI营销培训讲师培训师专家顾问唐兴通分享

全球B2B数字营销领域的企业社区&#xff08;或BBS&#xff09;标杆案例 在全球TOB&#xff08;企业对企业&#xff09;和B2B数字营销实践中&#xff0c;构建企业社区或在线论坛&#xff08;BBS的现代演变&#xff09;已成为增强客户关系、驱动产品采用、获取市场洞察和 genera…...

编程日记 2025/8/3 9:39:33

OC语言学习——Foundation框架（上）

一、字符串 NSString代表字符序列不可变的字符串&#xff0c;而NSMutable代表字符序列可变的字符串。 1.1 NSString字符串及功能 通过NSString&#xff0c;我们可以&#xff1a; 1、创建字符串。2、读取文件或网络URL来初始化字符串&#xff0c;或者将字符串写入文件或URL。3…...

编程日记 2025/8/1 20:17:16

【Linux】基础 IO（一）

&#x1f4dd;前言&#xff1a; 这篇文章我们来讲讲Linux——基础IO主要包括&#xff1a; 文件基本概念回顾 C文件的操作介绍系统关于文件的基本操作 &#x1f3ac;个人简介&#xff1a;努力学习ing &#x1f4cb;个人专栏&#xff1a;Linux &#x1f380;CSDN主页 愚润求学 …...

编程日记 2025/7/30 11:29:17

ODA服务器计算节点本地硬盘状态异常的处理

近期&#xff0c;在系统巡检过程中发现一个客户的ODA服务器本地硬盘节点出现告警&#xff0c;ODAX8 X9等&#xff0c;本地硬盘是使用的240GB M.2接口的SSD盘&#xff08;卡式&#xff09;的&#xff0c;这个没有外置的指示灯可以从服务器前面板查看&#xff0c;打开服务器机箱盖…...

编程日记 2025/8/1 23:18:01

图像处理篇---opencv实现坐姿检测

文章目录 前言一、方法概述使用OpenCV和MediaPipe关键点检测角度计算姿态评估 二、完整代码实现三、代码说明PostureDetector类find_pose()get_landmarks()cakculate_angle()evaluate_posture() 坐姿评估标准&#xff08;可进行参数调整&#xff09;&#xff1a;可视化功能&…...

编程日记 2025/8/1 9:22:41

微调ModernBERT为大型语言模型打造高效“过滤器”

ModernBERT&#xff08;2024 年 12 月&#xff09;是最近发布的小型语言模型&#xff0c;由 Answer.AI、LightOn 和 HuggingFace 共同开发。它利用了现代优化技术&#xff0c;如用于 8,192 token 上下文窗口的 RoPE 和 GeGLU layers&#xff0c;在保持效率的同时提升性能。jina…...

编程日记 2025/7/30 11:29:11

【C++指南】STL容器的安全革命：如何封装Vector杜绝越界访问与迭代器失效？

&#x1f31f; 各位看官好&#xff0c;我是egoist2023&#xff01; &#x1f30d; 种一棵树最好是十年前&#xff0c;其次是现在&#xff01; &#x1f680; 使用STL的三个境界&#xff1a;能用&#xff0c;明理&#xff0c;能扩展 &#x1f44d; 如果觉得这篇文章有帮助&#…...

编程日记 2025/8/1 1:37:18

Linux在web下http加密和配置虚拟主机及动态页面发布

web服务器的数据加密 1.简介&#xff1a;由于http协议以明文方式发送&#xff0c;不提供任何方式的数据加密&#xff0c;也不适合传输一些重要的信息&#xff0c;如银行卡号、密码等&#xff0c;解决该缺陷设计了安全套接字层超文本传输协议https&#xff1b; 2.https的握手流…...

编程日记 2025/7/30 11:29:07

8.2.CICD自动化

目录 一、持续集成&#xff08;CI&#xff09;核心实践 代码质量管理 • 静态代码分析&#xff1a;SonarQube规则定制&#xff08;安全漏洞、代码异味检测&#xff09; • 单元测试覆盖率&#xff1a;Jacoco报告生成与阈值控制&#xff08;覆盖率≥80%&#xff09; • 代码风格…...

编程日记 2025/7/30 11:29:05

解密数据结构之位图和布隆过滤器

位图和布隆过滤器 前言:笔者在前面分享过哈希的知识&#xff0c;但是笔者在哈希那篇博客中并没有给出哈希的应用场景&#xff0c;今天笔者分享的知识是关于哈希的应用&#xff0c;也就是大名鼎鼎的位图和布隆过滤器。1.位图的定义位图解决 2.位图实现1.先使用命名空间封装&…...

编程日记 2025/8/1 19:49:41

《从零构建大模型》PDF下载（中文版、英文版）

内容简介 本书是关于如何从零开始构建大模型的指南&#xff0c;由畅销书作家塞巴斯蒂安• 拉施卡撰写&#xff0c;通过清晰的文字、图表和实例&#xff0c;逐步指导读者创建自己的大模型。在本书中&#xff0c;读者将学习如何规划和编写大模型的各个组成部分、为大模型训练准备…...

编程日记 2025/8/2 9:33:53

Linux的web服务器的部署和优化

http中访问请求中I/O结构 在HTTP协议中&#xff0c;I/O&#xff08;输入/输出&#xff09;结构主要涉及客户端与服务器之间的请求和响应交互。以下是HTTP请求和响应的基本结构及其关键组成部分&#xff1a; HTTP请求结构 HTTP请求由请求行、请求头和请求体三部分组成 请求行…...

编程日记 2025/8/1 5:30:09

vue2 上传pdf，拖拽盖章，下载图片

效果图片&#xff1a; 不多废话上代码&#xff1a; <template><div class"pdf-stamp" onbeforecopyreturn false onselectdocument.selection.empty() ondragstartreturn false onselectstart return false ><div class"scroll-box" scro…...

编程日记 2025/8/3 12:11:50

MindSpore框架学习项目-ResNet药物分类-模型训练

目录 3.模型训练 3.1模型训练 3.1.1 定义优化器和损失函数 定义优化器和损失函数代码解析 3.1.2定义训练、推理函数 定义训练、推理函数代码解释 3.2模型保存 模型保存代码说明 3.3绘制acc和loss的曲线 参考内容&#xff1a; 昇思MindSpore | 全场景AI框架 | 昇思Mind…...

编程日记 2025/8/3 15:35:46

Jsp技术入门指南【十二】自定义标签

Jsp技术入门指南【十二】自定义标签 前言一、什么是标签二、标签的类型有哪些&#xff1f;1. 空标签2. 带有属性的标签3. 带主体的标签 三、自定义标签的部件3.1 自定义标签的四步骤3.2 标签处理程序3.3 自定义标签的开发及使用步骤第一步&#xff1a;创建标签助手类第二步&…...

编程日记 2025/7/30 12:55:09

数据库故障排查指南：从连接问题和性能优化

数据库作为现代应用程序的核心组件&#xff0c;其稳定性和性能直接影响整个系统的运行。然而&#xff0c;数据库在运行过程中常常会遇到各种故障&#xff0c;如连接失败、性能下降、数据不一致等问题。本文将从实际问题出发&#xff0c;结合代码示例和工具使用&#xff0c;系统…...

编程日记 2025/7/30 12:55:06

材料创新与工艺升级——猎板PCB引领高频阻抗板制造革命

在5G通信、AI服务器和自动驾驶的推动下&#xff0c;高频电路对信号完整性的要求日益严苛。猎板PCB作为国内高端PCB制造的标杆企业&#xff0c;通过材料创新与工艺革新&#xff0c;实现了阻抗控制的突破性进展&#xff0c;为行业树立了新标杆。 1. 高频材料的突破 传统FR-4基材…...

编程日记 2025/8/1 8:37:25

GitHub 趋势日报 (2025年05月09日)

本日报由 TrendForge 系统生成 https://trendforge.devlive.org/ &#x1f310; 本日报中的项目描述已自动翻译为中文 &#x1f4c8; 今日整体趋势 Top 10 排名项目名称项目描述今日获星总星数语言1voideditor/void⭐ 1879⭐ 15214TypeScript2ruanyf/weekly科技爱好者周刊&…...

编程日记 2025/7/31 18:24:14

SaaS场快订平台项目说明【持续更新】

一、项目介绍 SaaS场快订平台是一个高效、便捷的体育场馆在线预订平台。本项目采用SaaS方式开发&#xff0c;用户不需要安装软件&#xff0c;直接通过互联网访问在线程序即可使用。本项目主要构建了一个体育馆预订系统&#xff0c;项目的功能主要包括&#xff1a;用户注册与登…...

编程日记 2025/8/3 14:08:43

PyTorch API 7 - TorchScript、hub、矩阵、打包、profile

文章目录 torch.hub发布模型如何实现入口点&#xff1f;重要通知 从Hub加载模型运行加载的模型&#xff1a;下载的模型保存在哪里&#xff1f;缓存逻辑已知限制&#xff1a; TorchScript创建 TorchScript 代码混合使用追踪与脚本化TorchScript 语言内置函数与模块PyTorch 函数与…...

编程日记 2025/8/1 5:30:51

OpenVLA:开源的视觉-语言-动作模型

1. 简介 让我们先来介绍一下什么是OpenVLA&#xff0c;在这里&#xff1a; https://openvla.github.io/ 可以看到他们的论文、数据、模型。 OpenVLA 是一个拥有 70亿参数的开源 **视觉-语言-动作&#xff08;VLA&#xff09;**模型。它是在 Open X-Embodiment 数据集 中的 97万…...

编程日记 2025/8/2 18:54:36

android HashMap和List该如何选择

目录 一&#xff0c;ArrayList 1.1 数组 1.2 扩容 1.3 查询 1.4 插入&#xff0c;删除 1.5 小结 二&#xff0c;LinkedList 2.1 链表 2.2 查找 2.3 插入 2.4 小结 三&#xff0c;HashMap 扩容 四&#xff0c;SparseArray 五&#xff0c;ArrayMap 一&#xff0c;ArrayList 1.…...

编程日记 2025/8/2 19:50:11

Visual Studio 2022 远程调试

Visual Studio 2022 远程调试全过程 这篇文章尽可能地精细记录如何使用 Visual Studio 2022 完成 Windows 系统上的远程调试。适用场景包括本地编译&#xff0c;远程运行&#xff0c;两台机器分工合作调试。 一、设备网络通信环境 1.1 确保两台设备通信 本地设备: 安装 Visu…...

编程日记 2025/8/3 7:24:01

Linux：线程同步与互斥

目录 线程互斥 锁 初始化 销毁 加锁 解锁 线程同步 条件变量 初始化 销毁 等待条件满足 唤醒等待 pthread_cond_signal pthread_cond_broadcast 生产者消费者模型 3种关系 2种角色 1个交易场所 POSIX信号量 初始化 销毁 等待 发布 线程互斥 互斥相关…...

编程日记 2025/8/3 21:22:47

Kotlin Android LeakCanary内存泄漏检测实战

在Kotlin Android应用中使用LeakCanary检测内存泄漏的步骤如下&#xff1a; 1. 添加依赖 在模块的build.gradle文件中添加LeakCanary依赖&#xff1a; dependencies {debugImplementation com.squareup.leakcanary:leakcanary-android:2.12 // 使用最新版本 }2. 自动初始化&…...

编程日记 2025/8/3 5:09:11

MySQL 中 count(*)、count(1) 和 count(字段名) 有什么区别？

在 MySQL 中&#xff0c;COUNT(*)、COUNT(1) 和 COUNT(字段名) 的核心区别在于 统计逻辑 和 性能表现&#xff0c;具体如下&#xff1a; 1. 统计逻辑差异 函数形式统计规则COUNT(*)统计表中所有行的数量&#xff0c;忽略字段值是否为 NULL&#xff08;包括主键、非主键、NULL …...

编程日记 2025/7/30 18:36:44

CAD属性图框值与Excel联动（CAD块属性导出Excel、excel更新CAD块属性）——CAD c#二次开发

CAD插件实现块属性值与excel的互动&#xff0c;效果如下&#xff1a; 加载dll插件&#xff08;CAD 命令行输入netload &#xff0c;运行xx即可导出Excel&#xff0c;运行xx1即可根据excel更新dwg块属性值。&#xff09; 部分代码如下 // 4. 开启事务更新CAD数据using (Transact…...

编程日记 2025/8/2 13:14:10

青少年编程与数学 02-019 Rust 编程基础 05课题、复合数据类型

青少年编程与数学 02-019 Rust 编程基础 05课题、复合数据类型 一、元组&#xff08;Tuple&#xff09;&#xff08;一&#xff09;元组的定义&#xff08;二&#xff09;创建元组示例 &#xff08;三&#xff09;解构元组示例 &#xff08;四&#xff09;使用点号语法访问元组…...

编程日记 2025/7/30 18:36:40

51单片机入门教程——AT24C02数据存储

前言 本教程基于B站江协科技课程进行个人学习整理&#xff0c;专为拥有C语言基础的零基础入门51单片机新手设计。既帮助解决因时间差导致的设备迭代调试难题&#xff0c;也助力新手快速掌握51单片机核心知识&#xff0c;实现从C语言理论到单片机实践应用的高效过渡 。 目录 …...

编程日记 2025/7/30 18:36:38

cdn 是什么？

内容分发网络&#xff0c;Content Delivery Network 介绍 CDN&#xff08;Content Delivery Network&#xff09;是一种将内容分发到靠近用户的边缘服务器&#xff0c;以加速访问速度、减少延迟、降低源站压力的网络系统。 CDN 把网站的静态资源&#xff08;如 HTML、JS、CSS、…...

编程日记 2025/8/2 13:26:35

ENSP三层交换机实验原理及过程

华为eNSP&#xff08;Enterprise Network Simulation Platform&#xff09;是一款网络仿真工具&#xff0c;用于模拟华为网络设备的配置和操作。在三层交换机实验中&#xff0c;主要涉及三层交换机的路由功能、VLAN间通信、静态路由、动态路由协议&#xff08;如OSPF、RIP&…...

编程日记 2025/7/30 12:54:54

RK3568-OpenHarmony(1) : OpenHarmony 5.1的编译

概述: 本文主要描述了&#xff0c;如何在ubuntu-20.04操作系统上&#xff0c;编译RK3568平台的OpenHarmony 5.1版本。 搭建编译环境 a. 安装软件包 sudo apt-get install git-lfs ruby genext2fs build-essential git curl libncurses5-dev libncursesw5-dev openjdk-11-jd…...

编程日记 2025/8/1 3:57:43

动态路由EIGRP的配置

动态路由EIGRP的配置 动态路由EIGRP&#xff1a;增强内部网关协议 为何收敛快、不成环&#xff1f; 路由计算的无环路和路由的收敛速度是路由计算的重要指标。EIGRP协议由于使用了DUAL算法&#xff0c;使得EIGRP协议在路由计算中不可能有环路路由产生&#xff0c;同时路由计…...

编程日记 2025/8/3 1:20:58

Paging 3.0 + Kotlin 分页加载指南

Paging 3.0 是 Android Jetpack 组件中用于高效分页加载数据的现代化方案&#xff0c;结合 Kotlin 协程和 Flow 特性&#xff0c;能够显著简化分页逻辑的实现。以下是完整的实现指南和最佳实践&#xff1a; 一、Paging 3.0 核心优势 内置加载状态管理&#xff1a;自动跟踪加载…...

编程日记 2025/8/2 13:17:47

湖南（源点咨询）市场调研 商业综合体定位调研分享（下篇）

接着中篇&#xff0c;我们就要重点分析一下该地区消费者的特点&#xff1a; 综合来看&#xff0c;本地区还是以中等收入工薪阶层的新市民家庭为主&#xff0c;以亲子关系为家庭核心&#xff0c;居住条件改善、生活向好&#xff0c;渴望公共配套的提升丰富生活质感&#xff0c;…...

编程日记 2025/8/3 21:15:44

vue 中的ref

vue 中的ref vue 中的ref 1. ​​ref​​ ** 的基本作用** 在 Vue 中&#xff0c;ref 是用来获取 DOM 元素或者组件实例的一种方式。对于 <el-form> 组件&#xff0c;通过 ref 可以获取到该表单组件的实例&#xff0c;进而调用表单组件提供的各种方法和访问其属性。 …...

编程日记 2025/8/3 0:18:10

Kotlin 协程 vs RxJava vs 线程池：性能与场景对比

1. 轻量级任务&#xff1a;10,000 个并发延迟操作 假设需要并发执行 10,000 个非阻塞延迟任务&#xff08;如模拟定时请求&#xff09;&#xff1a; 线程池实现 ExecutorService executor Executors.newFixedThreadPool(64); // 最多 64 线程 List<Future<?>>…...

编程日记 2025/8/2 1:25:50

golang-ErrGroup用法以及源码解读笔记

介绍 ErrGroup可以并发执行多个goroutine&#xff0c;并可以很方便的处理错误 与sync.WaitGroup相比 错误处理 sync.WaitGroup只负责等待goroutine执行完成&#xff0c;而不处理返回值或者错误errgroup.Group目前虽然不能直接处理函数的返回值或错误。但是当goroutine返回错…...

编程日记 2025/8/1 6:05:43

遗传算法组卷系统实现（Java版）

遗传算法组卷系统实现&#xff08;Java版&#xff09; 下面是一个完整的遗传算法组卷系统的Java实现&#xff0c;包含题目表示、适应度计算、选择、交叉和变异等核心操作。 1. 核心类设计 1.1 题目实体类&#xff08;Question.java&#xff09; public class Question {pri…...

编程日记 2025/8/3 1:20:20

JVM 逃逸分析

JVM逃逸分析&#xff1a;让Java对象"乖乖听话"的侦探游戏 大家好&#xff01;我是你们的老朋友"代码神探福尔摩斯"&#xff0c;今天要带大家破解一个JVM界的经典悬案——如何让Java对象乖乖待在它该待的地方&#xff1f; 第一章&#xff1a;案发现场——…...

编程日记 2025/8/1 14:33:52