Loading [MathJax]/jax/output/CommonHTML/config.js

开发者社区

文档建议反馈控制台

文章/答案/技术大牛

发布

社区首页 >专栏 >bootstrap 下拉菜单

bootstrap 下拉菜单

用户5760343

发布于 2019-07-05 02:02:48

发布于 2019-07-05 02:02:48

4.6K0

举报

文章被收录于专栏：sktjsktj

t

<!doctype html> <html> <head> <meta charset="utf-8"> <title>联想控股</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link href="css/bootstrap.css" rel="stylesheet" type="text/css"> <script src="http://code.jquery.com/jquery.js"></script> <script src="js/bootstrap.min.js"></script> </head> <body> 　<div class="dropdown"> <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"> 下拉菜单<span class="caret"></span> </button> <ul class="dropdown-menu"> <li><a href="#">菜单项1</a></li> <li><a href="#">菜单项2</a></li> <li><a href="#">菜单项3</a></li> </ul> </div> </body> </html>

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

原始发表：2019.06.17 ，如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自作者个人站点/博客前往查看

如有侵权，请联系 cloudcommunity@tencent.com 删除。

本文参与腾讯云自媒体同步曝光计划，欢迎热爱写作的你一起参与！

评论

登录后参与评论

暂无评论

编辑精选文章

换一批

万字详解高可用架构设计

Go 开发者必备：Protocol Buffers 入门指南

10分钟带你彻底搞懂分布式链路跟踪

多租户的 4 种常用方案

亿级月活的社交 APP，陌陌如何做到 3 分钟定位故障？

60页PPT全解：DeepSeek系列论文技术要点整理

bootstrap 下拉菜单分割线

html css javascript

<!doctype html> <html> <head> <meta charset="utf-8"> <title>联想控股</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link href="css/bootstrap.css" rel="stylesheet" type="text/css"> <script src="http://code.jquery.com/jquery.js"></script> <script src="js/bootstrap.min.js"></script> </head> <body> <div class="dropdown"> <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"> 下拉菜单<span class="caret"></span> </button> <ul class="dropdown-menu"> <li><a href="#">菜单项1</a></li> <li><a href="#">菜单项2</a></li> <li class="divider"></li> <li><a href="#">菜单项3</a></li> </ul> </div> </body> </html>

用户5760343

2019/07/05

1.3K0

【Bootstrap】011-组件：Glyphicons 字体图标、下拉菜单

dropdown href meta bootstrap class

见https://v3.bootcss.com/components/#glyphicons

訾博ZiBo

2025/01/06

1280

【Bootstrap】011-组件：Glyphicons 字体图标、下拉菜单

bootstrap 导航栏

<!doctype html> <html> <head> <meta charset="utf-8"> <title>联想控股</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link href="css/bootstrap.css" rel="stylesheet" type="text/css"> <script src="http://code.jquery.com/jquery.js"></script> <script src="js/bootstrap.min.js"></script> </head> <body> <nav class="navbar navbar-default" role="navigation"> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#menu"> <span class="sr-only">展开导航</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="#">网站标题</a> </div> <div class="collapse navbar-collapse" id="menu"> <ul class="nav navbar-nav"> <li class="active"><a href="#">首页</a></li> <li><a href="#">导航标题1</a></li> <li><a href="#">导航标题2</a></li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">下拉菜单 <b class="caret"></b></a> <ul class="dropdown-menu"> <li><a href="#">下拉菜单1</a></li> <li class="divider"></li> <li><a href="#">下拉菜单2</a></li> <li class="divider"></li> </ul> </li> </ul> </div> </nav> </body> </html>

用户5760343

2019/07/05

3.6K0

bootstrap笔记（八）——表单样式和下拉菜单

bootstrap 笔记

<div class="container">  <span class="glyphicon glyphicon-tint"></span> <span class="glyphicon glyphicon-music"></span>  <span class="caret"></span> </div> <!DOCTYPE html> <html lang="en"> <

兮动人

2021/06/11

1.3K0

bootstrap笔记（八）——表单样式和下拉菜单

bootstrap 表单 3 按钮

https html c++网络安全 bootstrap

<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">

用户5760343

2022/01/10

1.4K0

bootstrap 表单 3 按钮

Bootstrap学习笔记上（带源码）

编程算法 c++

☑ 简单灵活可用于架构流行的用户界面和交互接口的html、css、javascript工具集。

牧云云

2022/03/11

3.9K0

Bootstrap学习笔记上（带源码）

【干货】通过Bootstrap框架添加下拉框到导航栏

navbar 框架 bootstrap class href

https://v3.bootcss.com/components/#navbar-default

未名编程

2024/10/12

1780

【干货】通过Bootstrap框架添加下拉框到导航栏

bootstrap scollspy 滚动监听

<!doctype html> <html> <head> <meta charset="utf-8"> <title>联想控股</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link href="css/bootstrap.css" rel="stylesheet" type="text/css"> <script src="http://code.jquery.com/jquery.js"></script> <script src="js/bootstrap.min.js"></script> <style> body { position: relative; }

用户5760343

2019/07/07

7080

【BootStrap】图片样式、辅助类样式和CSS组件 -附源码

dropdown input nav navbar text

.img-responsive：直接为图片添加该样式，可以实现响应式图片。 .center-block：图片居中样式，而不能使用text-center样式。图片形状样式：.img-rounded(圆角图片)、.img-circle(圆形图片)、.img-thumbnail(边框圆角)

谙忆

2021/01/21

2.6K0

【BootStrap】图片样式、辅助类样式和CSS组件 -附源码

Bootstrap学习------按钮

Bootstrap为我们提供了按钮组的样式,博主写了几个简单的例子，以后也许用的到。效果如下代码如下 <!DOCTYPE html> <html> <head> <title

用户1055830

2018/01/18

8570

Bootstrap学习------按钮

bootstrap css https 网络安全

花了一天时间学了下bootstrap入门，想必大家用css写前端页面的时候都很痛苦，bootstrap就是来解决这个问题的，它封装了css的很多样式，开发的时候直接拿来用就可以了，提高了开发效率

用户3112896

2019/09/26

3.4K0

如何使用 Bootstrap class 向按钮添加下拉菜单

如何使用 Bootstrap class 向按钮添加下拉菜单。如需向按钮添加下拉菜单，只需要简单地在一个 .btn-group 容器中放置按钮和下拉菜单即可。您也可以使用 <span class="caret"></span> 来指示按钮作为下拉菜单。

好派笔记

2021/09/18

5.8K0

bootstrap 下拉菜单禁用菜单项

button class dropdown href toggle

　<div class="dropdown"> <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"> 下拉菜单<span class="caret"></span> </button> <ul class="dropdown-menu"> <li><a href="#">菜单项1</a></li> <li class="disabled"><a href="#">菜单项2</a></li> <li><a href="#">菜单项3</a></li> </ul> </div>

用户5760343

2019/07/05

2.3K0

【Bootstrap】013-组件：导航、导航条、路径导航

navbar bootstrap class href meta

Bootstrap 中的导航组件都依赖同一个 .nav 类，状态类也是共用的。改变修饰类可以改变样式；

訾博ZiBo

2025/01/06

1670

【Bootstrap】013-组件：导航、导航条、路径导航

BootStrap文档

插件 bootstrap class href src

1. 概念：一个前端开发的框架，Bootstrap，是目前很受欢迎的前端框架。Bootstrap 是基于 HTML、CSS、JavaScript 的，它简洁灵活，使得 Web 开发更加快捷。

张哥编程

2024/12/13

1020

Bootstrap3-导航条[通俗易懂]

c++java https 网络安全

发布者：全栈程序员栈长，转载请注明出处：https://javaforall.cn/129314.html原文链接：https://javaforall.cn

全栈程序员站长

2022/07/29

2.6K0

bootstrap教程，SQL

javascript http bootstrap jquery css

DDL数据定义语言 TPL事务处理语言 DCL数据控制语言 DML数据操作语言

达达前端

2019/07/03

9280

bootstrap教程，SQL

BootStrap使用

BootStrap基本使用图书管理系统界面示例代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>图书管理系统</title> <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.4.1/jquery.min.js"></script> <link href="https://cdn.bootcdn.net/ajax

HammerZe

2022/03/25

6820

Bootstrap框架的简单使用

bootstrap html cdn button table

Bootstrap 是由 Twitter 公司开发维护的简洁、直观、强悍的前端开发 UI 框架，它提供了大量编写好的 CSS 样式，允许开发者结合一定HTML 结构及JavaScript，快速编写功能完善的网页及常见交互效果，让web开发更迅速、简单。

岳泽以

2022/10/26

3.8K0

Bootstrap框架的简单使用

Web前端基础（09）

1.下载框架文件（也可从Bootstrap官网下载） Bootstrap V3.3.7 Starter ZIP 下载并解压出template和bootstrap3两个文件夹放到工程中 2.复制template文件夹中的starter.html 粘贴到需要创建页面的地方,改名字即可

海拥

2021/08/23

1K0

相关推荐

bootstrap 下拉菜单分割线

更多 >

LV.1

这个人很懒，什么都没有留下～

作者相关精选

换一批

加入讨论

的问答专区 >

相关课程

一站式学习中心 >

微信公众号在线学习平台搭建实践_《硅谷课堂》