按钮的向下三角形，我们是通过在<button>标签中添加一个“<span>”标签元素，并且命名为“caret”.

<div class="btn-group dropup">

    <button class="btn btn-default dropdown-toggle" data-toggle="dropdown" type="button">按钮下拉菜单<span class="caret"></span></button>

    <ul class="dropdown-menu">

        <li><a href="##">按钮下拉菜单项</a></li>

        <li><a href="##">按钮下拉菜单项</a></li>

        <li><a href="##">按钮下拉菜单项</a></li>

        <li><a href="##">按钮下拉菜单项</a></li>

    </ul>

</div>

Bootstrap系列 -- 35. 按钮的向下向上三角形的更多相关文章

  1. Bootstrap系列 -- 29. 按钮组

    单个按钮在Web页面中的运用有时候并不能满足我们的业务需求,常常会看到将多个按钮组合在一起使用,比如富文本编辑器里的一组小图标按钮等 按钮组和下拉菜单组件一样,需要依赖于button.js插件才能正常 ...

  2. Bootstrap系列 -- 22. 按钮详解

    Bootstrap框架首先通过基础类名“.btn”定义了一个基础的按钮风格,然后通过“.btn-default”定义了一个默认的按钮风格.默认按钮的风格就是在基础按钮的风格的基础上修改了按钮的背景颜色 ...

  3. Bootstrap系列 -- 34. 按钮下拉菜单

    按钮下拉菜单仅从外观上看和上一节介绍的下拉菜单效果基本上是一样的.不同的是在普通的下拉菜单的基础上封装了按钮(.btn)样式效果.简单点说就是点击一个按钮,会显示隐藏的下拉菜单.按钮下拉菜单其实就是普 ...

  4. Bootstrap系列 -- 30. 按钮工具栏

    在富文本编辑器中,将按钮组分组排列在一起,比如说复制.剪切和粘贴一组:左对齐.中间对齐.右对齐和两端对齐一组.Bootstrap框架按钮工具栏也提供了这样的制作方法,你只需要将按钮组“btn-grou ...

  5. Bootstrap系列 -- 22. 按钮

    Bootstrap框架首先通过基础类名“.btn”定义了一个基础的按钮风格,然后通过“.btn-default”定义了一个默认的按钮风格.默认按钮的风格就是在基础按钮的风格的基础上修改了按钮的背景颜色 ...

  6. Bootstrap系列 -- 32. 按钮垂直分组

    实际运用当中,总会碰到垂直显示的效果.在Bootstrap框架中也提供了这样的风格.我们只需要把水平分组的“btn-group”类名换成“btn-group-vertical”即可. <div ...

  7. Bootstrap学习-菜单-按钮-导航

    1.下拉菜单(基本用法) 在使用Bootstrap框架的下拉菜单时,必须调用Bootstrap框架提供的bootstrap.js文件.当然,如果你使用的是未编译版本,在js文件夹下你能找到一个名为“d ...

  8. Bootstrap入门（十）组件4：按钮组与下拉菜单结合

    Bootstrap入门(十)组件4:按钮组与下拉菜单结合   先引入本地的CSS文件和JS文件(注:1.bootstrap是需要jQuery支持的.2.需要在<body>当中添加) < ...

  9. 简单叨叨bootstrap按钮无限层级下拉菜单的实现

    0.写在前面的话 最近看书都懈怠了,又正值新项目,虽说并不是忙得不可开交,好吧我老实交待,我就是偷懒了其实,博客也没更.言归正传,对于前端的不熟悉现在确实是个让我头疼的事情,以至于一些功能要在网络上漫 ...

随机推荐

  1. jquery实践案例--验证电子邮箱

    <input type="email" name="email" id="email" value="" onpa ...

  2. 虚拟机ping不通主机，但是主机可以ping通虚拟机（转载）

    我在Windows7系统安装了虚拟机,通过虚拟机安装了Ubuntu13.04,我设置的主机与虚拟机的连接方式是桥接,安装好后,发现虚拟机ping不通主机,但是主机可以ping通虚拟机. 我的操作是:关 ...

  3. Git 升级与基础适用

    Git 升级 老方法 yum install git 目前centos6安装的 git 版本为1.7相对于 github 以及自己安装的 git 服务器都相对比较老,所以一般不适用此方法安装) 编译安 ...

  4. hyper-v无线网络上外网

    这个通过无线网络上外网也是找了很多文章,大部分写的都不详细,没有办法成功,原理就是创建一个虚拟网卡,然后把创建的虚拟网卡和无线网卡桥接,虚拟机中使用创建的虚拟网卡,这里创建的虚拟网卡指的是用hyper ...

  5. jsp页面img利用tomcat配置访问服务器绝对路径显示图片

    1.打开tomcat下的server.xml文件,路径\apache-tomcat-7.0.62\conf文件夹下. 2.下<host></host>加入<Context ...

  6. Mac OS X 快捷键

    启动快捷键 按下按键或组合键,直到所需的功能出现(例如,在启动过程中按住 Option 直到出现“启动管理程序”,或按住 Shift 直到出现“安全启动”).提示:如果启动功能未起作用,而您使用的是第 ...

  7. 给Azure 虚机的硬盘扩充容量[转]

    接到用户的需求,需要给Azure 上虚机的硬盘扩充空间,网上找到下面的资源,做个备忘: https://github.com/azure-contrib/WindowsAzureDiskResizer

  8. linux搭建一个配置简单的nginx反向代理服务器 2个tomcat

    1.我们只要实现访问nginx服务器能跳转到不同的服务器即可,我本地测试是这样的, 在nginx服务器里面搭建了2个tomcat,2个tomcat端口分别是8080和8081,当我输入我nginx服务 ...

  9. 20150912华为机考2之"输入一段字符串(英文)，将每个单词首字母大写后输出"

    还有其他一些(隐性)要求(要不然无法通过测试): .如果首字母已经大写,则不用变 .不是英文字母的不变 e.g. Input: hello world! this is _Ljj speaking! ...

  10. 使用EntityFramework6完成增删查改和事务

    使用EntityFramework6完成增删查改和事务 上一节我们已经学习了如何使用EF连接数据库,并简单演示了一下如何使用EF6对数据库进行操作,这一节我来详细讲解一下. 使用EF对数据库进行操作, ...