bootstrap:下拉菜单

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>下拉菜单DEMO</title>
<link rel="stylesheet" type="text/css" href="/cdn.bootcss.com/bootstrap/3.3.2/css/bootstrap.min.css"  />
</head>
<body>
	<!-- 下拉菜单 -->
	<div class="btn-group dropdown">
		<button class="btn btn-default dropdown-toggle" data-toggle="dropdown">
			&nbsp;选择...&nbsp;
			<span class="caret"></span>
		</button>
		<ul class="dropdown-menu">
			<li><a href="#">Item 1</a></li>
			<li><a href="#">Item 2</a></li>
			<li><a href="#">Item 3</a></li>
			<li><a href="#">Item 4</a></li>
		</ul>
	</div>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
	<!-- 上拉菜单 -->
	<div class="btn-group dropup">
		<button class="btn btn-default dropdown-toggle" data-toggle="dropdown">
			&nbsp;选择...&nbsp;
			<span class="caret"></span>
		</button>
		<ul class="dropdown-menu">
			<li><a href="#">Item 1</a></li>
			<li><a href="#">Item 2</a></li>
			<li><a href="#">Item 3</a></li>
			<li><a href="#">Item 4</a></li>
		</ul>
	</div>
<br/>
<br/>
<br/>
<br/>
<!-- 	<div> -->
<!-- 		<div class="col-md-3"> -->
<!-- 			<select class="form-control"> -->
<!-- 				<option value="1">Item 1</option> -->
<!-- 				<option value="2">Item 2</option> -->
<!-- 				<option value="3">Item 3</option> -->
<!-- 				<option value="4">Item 4</option> -->
<!-- 			</select> -->
<!-- 		</div> -->
<!-- 	</div> -->

<!-- 基础的Jquery -->
<script type="text/javascript" src="/cdn.bootcss.com/jquery/3.3.1/jquery.min.js" ></script>
<!-- 基础的bootstrap -->
<script type="text/javascript" src="/cdn.bootcss.com/bootstrap/3.3.2/js/bootstrap.min.js" ></script>
<script type="text/javascript">
	$(function(){
		
	});
</script>
</body>
</html>

效果:

bootstrap和jQuery下载地址: 

https://download.csdn.net/download/Bof_jangle/88614214

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/241475.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

TCP/IP详解——网络基本概念

文章目录 一、网络基本概念1. OSI 7层模型1.1 每层对应的协议1.2 每层涉及的设备1.2.1 物理层设备1.2.2 数据链路层设备1.2.3 网络层设备1.2.4 传输层设备1.2.5 交换机和路由器的应用1.2.6 问题 2. TCP/IP 4层模型3. 物理层传输介质3.1 冲突域 4. 数据链路层4.1 以太网帧结构4.…

​flutter 代码混淆

Flutter 应用混淆&#xff1a;Flutter 应用的混淆非常简单&#xff0c;只需要在构建 release 版应用时结合使用 --obfuscate 和 --split-debug-info 这两个参数即可。–obfuscate --split-debug-info 用来指定输出调试文件的位置&#xff0c;该命令会生成一个符号映射表。目前支…

mysql字段设计规范:使用unsigned(无符号的)存储非负值

如果一个字段存储的是数值&#xff0c;并且是非负数&#xff0c;要设置为unsigned&#xff08;无符号的&#xff09;。 例如&#xff1a; 备注&#xff1a;对于类型是 FLOAT、 DOUBLE和 DECIMAL的&#xff0c;UNSIGNED属性已经废弃了&#xff0c;可能在mysql的未来某个版本去…

C#学习笔记 - C#基础知识 - C#从入门到放弃

C# 第1节 C# 简单介绍1.1 C# 是什么1.2 C# 强大的编程功能1.3 C# 发展史1.4 C#与Java区别 第2节 C#程序结构2.1 Hello world2.2 C# 结构解析 第3节 C#基本语法3.1 第1节 C# 简单介绍 1.1 C# 是什么 C# 的发音为“C Sharp”&#xff0c;是一门由微软开发并获得了 ECMA&#xf…

Godot导出Android包报错:无效的包名称

问题描述 使用Godot为项目导出Android平台包时报错&#xff0c;提示&#xff1a;“无效的包名称&#xff1a;项目名称不符合包名格式的要求。请显式指定包名。” 解决办法 修改导出配置项“包->唯一名称”。 该项缺省值“org.godotengine.$genname”不能直接使用&#x…

Java版本+鸿鹄企业电子招投标系统源代码+支持二开+Spring cloud +鸿鹄电子招投标系统

项目说明 随着公司的快速发展&#xff0c;企业人员和经营规模不断壮大&#xff0c;公司对内部招采管理的提升提出了更高的要求。在企业里建立一个公平、公开、公正的采购环境&#xff0c;最大限度控制采购成本至关重要。为了符合国家电子招投标法律法规及相关规范&#xff0c;…

Debian openmediavault 自建Nas系统共享,raid5与btrfs文件系统无损原数据扩容

一、适用环境 1、企业自有物理专业服务器&#xff0c;一些敏感数据不外流时&#xff0c;使用openmediavault自建NAS系统&#xff1b; 2、在虚拟化环境中自建NAS系统&#xff0c;用于内网办公&#xff0c;或出差外网办公时&#xff0c;企业内的文件共享&#xff1b; 3、虚拟化环…

SD-WAN实现分公司与总部组网高效互联

随着企业的发展和扩张&#xff0c;对于分公司和总部的组网需求越来越多。然而企业分公司和总部之间的组网连接通常十分复杂&#xff0c;不仅消耗大量的预算&#xff0c;还耗费很长的部署时间。SD-WAN的出现使组网连接变得轻松、简单&#xff0c;提高了企业的网络连接效率和性能…

珠宝销售技巧培训之如何提升珠宝销售技巧

珠宝销售技巧培训之如何提升珠宝销售技巧 珠宝销售是一项需要技巧和策略的工作。在竞争激烈的珠宝市场中&#xff0c;销售人员需要不断提升自己的销售技巧&#xff0c;以吸引更多的客户并保持他们的忠诚度。本文将介绍一些提升珠宝销售技巧的方法&#xff0c;包括了解客户需求…

智能配电运维管理平台

智能配电运维管理平台是一种集成了自动化、智能化等技术手段的电力运维管理平台。依托智慧化工具-电易云&#xff0c;对配电系统的电力设备进行实时监控、数据分析和处理。该平台通常由数据采集、监控预警、计划维护、数据分析、决策支持等模块组成&#xff0c;能够实现电力设备…

如何处理PHP开发中的单元测试和自动化测试?

如何处理PHP开发中的单元测试和自动化测试&#xff0c;需要具体代码示例 随着软件开发行业的日益发展&#xff0c;单元测试和自动化测试成为了开发者们重视的环节。PHP作为一种广泛应用于Web开发的脚本语言&#xff0c;单元测试和自动化测试同样也在PHP开发中扮演着重要的角色…

冯诺依曼体系与操作系统的理解

目录 一.冯诺依曼体系结构 存储分级 为什么程序运行之前&#xff0c;必须加载到内存上&#xff1f; 二.操作系统 操作系统是什么&#xff1f; 为什么需要操作系统&#xff1f; 操作系统是如何管理软硬件资源&#xff1f; 一.冯诺依曼体系结构 我们常见的计算机&#xff…

docker安装rabbitmq并安装死信队列插件

环境 debian11 docker 20.10.22 rabbitmq 3.10.0 拉取镜像到本地 docker pull rabbitmq3.10.0 实例化 docker run -d --name rabbit -e RABBITMQ_DEFAULT_USERadmin -e RABBITMQ_DEFAULT_PASSadmin -p 15672:15672 -p 5672:5672 -p 25672:25672 -p 61613:61613 -p 1883:…

国标GB28181安防监控系统/磁盘阵列EasyCVR(V.3.4)新亮点:免保活功能

TSINGSEE青犀近日发布了EasyCVR安防管理平台的V.3.4版本&#xff0c;其中一大亮点就是很多朋友都在咨询的“免保活”功能&#xff0c;那么&#xff0c;什么是“免保活”功能&#xff1f;又该如何配置呢&#xff1f; 在EasyCVR平台有个【按需直播】按钮&#xff0c;顾名思义&…

3Dmax快捷键大全,让你的创作飞起来!附赠3dmax工具箱插件,快来收藏吧!

你是否曾经在3Dmax中因为繁琐的操作而感到困扰&#xff1f; 今天&#xff0c;我将为大家带来一份精心整理的3Dmax常用快捷键宝典&#xff0c;让你在建模、材质编辑、动画制作等各个方面都能游刃有余&#xff0c;让你的创作飞起来&#xff01;&#xff01; &#x1f4a1; 选择与…

专业证件翻译哪里比较正规?

随着国际化的步伐不断加快&#xff0c;我们与国外的交流日益频繁&#xff0c;无论是出国留学、旅游还是商务活动&#xff0c;都离不开证件翻译。那么&#xff0c;在选择证件翻译服务时&#xff0c;我们应该注意哪些事项呢&#xff1f;哪里能找到正规的翻译服务呢&#xff1f; 我…

Flink的容错机制

容错机制 容错&#xff1a;指出错后不影响数据的继续处理&#xff0c;并且恢复到出错前的状态。 检查点&#xff1a;用存档读档的方式&#xff0c;将之前的某个时间点的所有状态保存下来&#xff0c;故障恢复继续处理的结果应该和发送故障前完全一致&#xff0c;这就是所谓的检…

Flutter自定义TextInputFormatter实现金额输入框,同时解决iOS数字键盘不能输入小数点的问题

一、实现的效果 二、金额输入框基本要求 只能输入.和数字小数点后只能有俩位小数点不能作为开头 三、在iOS设备上这里还有个坑&#xff0c;数字键盘上这个小数点会根据你手机设置的不同国家地区来决定显示是.还是, 如下 所以这个时候最好的解决办法是允许输入.、数字和,然后在…

C++ Qt开发:CheckBox多选框组件

Qt 是一个跨平台C图形界面开发库&#xff0c;利用Qt可以快速开发跨平台窗体应用程序&#xff0c;在Qt中我们可以通过拖拽的方式将不同组件放到指定的位置&#xff0c;实现图形化开发极大的方便了开发效率&#xff0c;本章将重点介绍CheckBox单行输入框组件的常用方法及灵活运用…

GPT分区好处不言而喻!如何在Windows 11中将MBR转换为GPT分区

学习如何在Windows 11上将MBR转换为GPT分区将使你的计算机更好地组织起来。 GPT分区&#xff08;GUID分区表&#xff09;优于MBR分区&#xff0c;因为它允许128个分区&#xff0c;并且支持远大于2 TB的分区&#xff08;每个分区最多支持1880万TB的空间&#xff09;。另一方面&…