bootstrap:选项卡功能DEMO

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>选项卡</title>
<link rel="stylesheet" type="text/css" href="/cdn.bootcss.com/bootstrap/3.3.2/css/bootstrap.min.css"  />
</head>
<body>
<ul id="myTab" class="nav nav-tabs"><li class="active"><a href="#section1">Section1</a></li><li ><a href="#section2">Section2</a></li><li ><a href="#section3">Section3</a></li>
</ul>
<div class="tab-content"><div id="section1" class="tab-pane in active"><h2>section1</h2><p>...</p></div><div id="section2" class="tab-pane"><h2>Section2</h2><p>...</p></div><div id="section3" class="tab-pane"><h2>Section3</h2><p>...</p></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(){var hash = window.location.hash;hash && $('ul.nav a[href="'+hash+'"]').tab('show');$("#myTab a").click(function(e){$(this).tab('show');});});
</script>
</body>
</html>

效果图:

bootstrap和jQuery下载地址:

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

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

记一次测试环境git翻车经历

本来想拉一个功能分支进行新的功能开发&#xff0c;合并代码发现没有冲突居然有文件被修改了&#xff0c;贸然选择最近的一次回滚提交&#xff0c;没想到不假思索的push -f 导致一部分dev主干的代码不见了。 事故记录 开发分支origin/dev&#xff0c;功能分支file 合并之后发…

Java 实现 文档 添加 水印 工具类

一、pom 文件引用 <dependency><groupId>org.apache.poi</groupId><artifactId>poi</artifactId><version>4.1.2</version></dependency><dependency><groupId>org.apache.poi</groupId><artifactId>…

MeterSphere实战(一)

MeterSphere是一位朋友讲到的测试平台&#xff0c;说这东西是开源的&#xff0c;因为我是做测试的&#xff0c;很乐意了解一些新鲜事物。在我看来&#xff0c;测试就是要专注一些领域&#xff0c;然后要啥都会一点点&#xff0c;接着融会贯通起来&#xff0c;这样就可以万变不离…

C语言--不使用库函数,把一个数字转为字符串【详细解释】

一.题目描述 输入一个数字&#xff0c;把他转为字符串 比如&#xff1a;输入数字&#xff1a;12345 输出&#xff1a;12345&#xff08;这里的12345是字符串12345&#xff09; 二.思路分析 比如给定一个数字12345&#xff0c;先把它转为字符54321&#xff08;“54321”&#…

线程互斥与同步

用户级线程 内核的LWP Linux线程 OS概念中经常说的 用户级线程 和 内核级线程 也就是线程实现真的是在OS内部实现&#xff0c;还是应用层或用户层实现 很明显Linux是属于用户级线程 用户级执行流&#xff08;用户级线程&#xff09; &#xff1a;内核lwp 1 : 1 也有1&…

骁龙8 Gen 3 vs A17 Pro

骁龙8 Gen 3 vs A17 Pro——谁会更胜一筹&#xff1f; Geekbench、AnTuTu 和 3DMark 等基准测试在智能手机领域发挥着至关重要的作用。它们为制造商和手机爱好者提供了设备性能的客观衡量标准。这些测试有助于评估难以测量的无形方面。然而&#xff0c;值得注意的是&#xff0c…

骚操作:NanoDrop测蛋白浓度

​大家好&#xff0c;最近实验室的BCA仪器坏了&#xff0c;偶然发现nanodrop也可以测蛋白浓度&#xff0c;省不少时间&#xff01;本方法原理是&#xff1a;紫外吸收 友情提示&#xff1a;由于表格的存在&#xff0c;用电脑看本推文&#xff0c;效果更好 紫外吸收法 较为灵…

31条PCB设计布线技巧:

大家在做PCB设计时&#xff0c;都会发现布线这个环节必不可少&#xff0c;而且布线的合理性&#xff0c;也决定了PCB的美观度和其生产成本的高低&#xff0c;同时还能体现出电路性能和散热性能的好坏&#xff0c;以及是否可以让器件的性能达到最优等。 本篇内容&#xff0c;将…

分布式锁实现方案 - Lock4j 使用

一、Lock4j 分布式锁工具 你是不是在使用分布式锁的时候&#xff0c;还在自己用 AOP 封装框架&#xff1f;那么 Lock4j 你可以考虑一下。 Lock4j 是一个分布式锁组件&#xff0c;其提供了多种不同的支持以满足不同性能和环境的需求。 立志打造一个简单但富有内涵的分布式锁组…

Redis分布式缓存超详细总结!

文章目录 前言一、Redis持久化解决数据丢失问题1.RDB&#xff08;Redis Database Backup file&#xff09;持久化&#xff08;1&#xff09;执行RDB&#xff08;2&#xff09;RDB方式bgsave的基本流程&#xff08;3&#xff09;RDB会在什么时候执行&#xff1f;save 60 1000代表…

VBA信息获取与处理:在EXCEL中随机函数的利用

《VBA信息获取与处理》教程(版权10178984)是我推出第六套教程&#xff0c;目前已经是第一版修订了。这套教程定位于最高级&#xff0c;是学完初级&#xff0c;中级后的教程。这部教程给大家讲解的内容有&#xff1a;跨应用程序信息获得、随机信息的利用、电子邮件的发送、VBA互…

计算机网络(三) | 数据链路层 PPP协议、广播CSMA/CD协议、集线器、交换器、扩展and高速以太网

文章目录 1 数据链路基本概念和问题1.1 基本概念1.2 基本问题&#xff08;1&#xff09;封装成帧&#xff08;2&#xff09;透明传输&#xff08;3&#xff09;差错控制 2.数据链路层协议2.1 点对点 PPP协议2.1.1 需要实现的2.1.2 PPP组成2.1.3 帧格式2.1.4 工作流程 2.2 广播 …

内网穿透的应用-如何结合Cpolar内网穿透工具实现在IDEA中远程访问家里或者公司的数据库

文章目录 1. 本地连接测试2. Windows安装Cpolar3. 配置Mysql公网地址4. IDEA远程连接Mysql小结 5. 固定连接公网地址6. 固定地址连接测试 IDEA作为Java开发最主力的工具&#xff0c;在开发过程中需要经常用到数据库&#xff0c;如Mysql数据库&#xff0c;但是在IDEA中只能连接本…

配置BFD多跳检测示例

BFD简介 定义 双向转发检测BFD&#xff08;Bidirectional Forwarding Detection&#xff09;是一种全网统一的检测机制&#xff0c;用于快速检测、监控网络中链路或者IP路由的转发连通状况。 目的 为了减小设备故障对业务的影响&#xff0c;提高网络的可靠性&#xff0c;网…

【链表Linked List】力扣-117 填充每个节点的下一个右侧节点指针II

目录 问题描述 解题过程 官方题解 问题描述 给定一个二叉树&#xff1a; struct Node {int val;Node *left;Node *right;Node *next; } 填充它的每个 next 指针&#xff0c;让这个指针指向其下一个右侧节点。如果找不到下一个右侧节点&#xff0c;则将 next 指针设置为 N…

C++中字符串详解

在C语言中只能通过字符串数组来模拟字符串&#xff0c;没有字符串类型。在C引入了string类来表示字符串类型。从而用它定义字符串。 在C语言中&#xff1a; char str[] "abc"; char str[] {a&#xff0c;b,c,\0}; char* str "abc"; //这三种形式是C语言…

因为高考考砸了,我学了计算机

2015年&#xff0c;是我高中的最后一年。 2023年&#xff0c;我已在计算机领域工作十多个年头。 我出生在东部省份的一个不沿海小县城&#xff0c;在那里度过了我高考前的17年。起点平平&#xff0c;没有任何特长傍身&#xff0c;也可以说是毫无亮点&#xff1b;成绩中等&#…

中文语音标注工具FunASR(语音识别)

全称 A Fundamental End-to-End Speech Recognition Toolkit&#xff08;一个语音识别工具&#xff09; 可能大家用过whisper&#xff08;openAi&#xff09;&#xff0c;它【标注英语的确很完美】&#xff0c;【但中文会出现标注错误】或搞了个没说的词替换上去&#xff0c;所…

APP备案,最新获取安卓签名文件中MD5等信息方法

1.通过签名文件获取SHA1和SHA256 直接通过cmd执行命令 keytool -list -v -keystore xxxxx/xxx/xx/xxx.keystore输入后回车会提示输入密码库口令&#xff0c;直接输入Keystore密码&#xff08;输入过程中终端上不会显示&#xff0c;输完回车就行&#xff09; 2.获取md5 由于…

redis集群(cluster)笔记

1. 定义&#xff1a; 由于数据量过大&#xff0c;单个Master复制集难以承担&#xff0c;因此需要对多个复制集进行集群&#xff0c;形成水平扩展每个复制集只负责存储整个数据集的一部分&#xff0c;这就是Redis的集群&#xff0c;其作用是提供在多个Redis节点间共享数据的程序…