Bootstrap下拉菜单Dropdowns的实现代码


Posted in Javascript onMarch 17, 2017

本文实例为大家分享了Bootstrap下拉菜单的具体代码,供大家参考,具体内容如下

<!DOCTYPE html> 
<html> 
 <head> 
  <title>Bootstrap-下拉菜单标题</title> 
   <meta charset="utf-8"> 
  <link rel="stylesheet" href="css/bootstrap.min.css" rel="external nofollow" > 
  <style> 
   body {  
    padding-top: 150px;  
    padding-bottom: 40px;  
    font-family: '宋体';  
   } 
  </style> 
 </head> 
 
 <body> 
  <div class="container"> 
  <div class="dropdown"> 
   <button type="button" class="btn dropdown-toggle" data-toggle="dropdown" 
   style="font-size:36px;: blue; width:100;height: 50; "> 
    常用语种 <span class="caret"> </span> 
   </button> 
   <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1"> 
    <li role="presentation" class="dropdown-header"> 
     下拉菜单标题 
    </li> 
    <li role="presentation" > 
     <a role="menuitem" tabindex="-1" href="#" rel="external nofollow" rel="external nofollow" >中文</a> 
    </li> 
    <li role="presentation" class="dropdown-header"> 
     下拉菜单标题 
    </li> 
    <li role="presentation"> 
     <a role="menuitem" tabindex="-1" href="#" rel="external nofollow" rel="external nofollow" >英文</a> 
    </li> 
   </ul> 
  </div> 
  </div> 
  <script src="js/jquery.min.js"></script> 
  <script src="js/bootstrap.min.js"></script> 
 </body> 
</html>

 效果图:

Bootstrap下拉菜单Dropdowns的实现代码

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
默认让页面的第一个控件选中的javascript代码
Dec 26 Javascript
jQuery筛选器children()案例详解(图文)
Feb 17 Javascript
Js base64 加密解密介绍
Oct 11 Javascript
不提示直接关闭网页窗口的JS示例代码
Dec 17 Javascript
借助javascript代码判断网页是静态还是伪静态
May 05 Javascript
浏览器缩放检测的js代码
Sep 28 Javascript
微信公众平台开发教程(六)获取个性二维码的实例
Dec 02 Javascript
js 简易版滚动条实例(适用于移动端H5开发)
Jun 26 Javascript
Three.js利用orbit controls插件(轨道控制)控制模型交互动作详解
Sep 25 Javascript
JS中this的指向以及call、apply的作用
May 06 Javascript
vue实现前端分页完整代码
Jun 17 Javascript
jQuery实现简单全选框
Sep 13 jQuery
Bootstrap面板(Panels)的简单实现代码
Mar 17 #Javascript
Bootstrap模态框(Modal)实现过渡效果
Mar 17 #Javascript
详解Vue.js入门环境搭建
Mar 17 #Javascript
使用jquery datatable和bootsrap创建表格实例代码
Mar 17 #Javascript
jquery PrintArea 实现票据的套打功能(代码)
Mar 17 #Javascript
基于bootstrap实现收缩导航条
Mar 17 #Javascript
javascript基本数据类型和转换
Mar 17 #Javascript
You might like
echo(),print(),print_r()之间的区别?
2006/11/19 PHP
composer.lock文件的作用
2016/02/03 PHP
Js的MessageBox
2006/12/03 Javascript
工作中常用到的JS表单验证代码(包括例子)
2010/11/11 Javascript
仿jQuery的siblings效果的js代码
2011/08/09 Javascript
javascript 判断中文字符长度的函数代码
2012/08/27 Javascript
JavaScript?Apple设备检测示例代码
2013/11/15 Javascript
javascript无刷新评论实现方法
2015/05/13 Javascript
Jquery 垂直多级手风琴菜单附源码下载
2015/11/17 Javascript
WordPress中鼠标悬停显示和隐藏评论及引用按钮的实现
2016/01/12 Javascript
JavaScript中push(),join() 函数 实例详解
2016/09/06 Javascript
angularjs ocLazyLoad分步加载js文件实例
2017/01/17 Javascript
js实现城市级联菜单的2种方法
2017/06/23 Javascript
关于js对textarea换行符的处理方法浅析
2018/08/03 Javascript
js中位运算的运用实例分析
2018/12/11 Javascript
基于Layui自定义模块的使用方法详解
2019/09/14 Javascript
python实现的简单文本类游戏实例
2015/04/28 Python
django定期执行任务(实例讲解)
2017/11/03 Python
Python3中的列表生成式、生成器与迭代器实例详解
2018/06/11 Python
python 借助numpy保存数据为csv格式的实现方法
2018/07/04 Python
简单了解python的一些位运算技巧
2019/07/13 Python
python操作toml文件的示例代码
2020/11/27 Python
印度在线杂货店:bigbasket
2018/08/23 全球购物
Timberland德国官网:靴子、鞋子、衣服、夹克及配件
2019/12/10 全球购物
Farfetch巴西官网:奢侈品牌时尚购物平台
2020/10/19 全球购物
以下的初始化有什么区别
2013/12/16 面试题
武汉世纪畅想数字传播有限公司.NET笔试题
2014/07/22 面试题
关于幼儿的自我评价
2013/12/18 职场文书
周鸿祎:教你写创业计划书
2013/12/30 职场文书
证婚人搞笑证婚词
2014/01/10 职场文书
秋季运动会稿件
2014/01/30 职场文书
2015年学生管理工作总结
2015/05/26 职场文书
2016机关干部作风建设心得体会
2016/01/21 职场文书
UNION CREATIVE《Re:从零开始的异世界生活》雷姆手办
2022/03/20 日漫
Java实现注册登录跳转
2022/06/16 Java/Android
MySQL 原理与优化之Update 优化
2022/08/14 MySQL