按钮的向下三角形，我们是通过在<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 Form 表单提交插件-----formSerialize，fieldSerialize，fieldValue，resetForm，clearForm，clearFields的 应用

    一.jQuery Form的其他api  1.  formSerialize 将表单序列化成查询串.这个方法将返回一个形如: name1=value1&name2=value2的字符串.是否可 ...

  2. Linux系统之压缩、解压缩，vi编辑器，系统初始化服务和系统监控

    一.正文处理,压缩与解压缩 1.内容重定向>与>> >:覆盖,将>号左边的结果覆盖到>号右边的文件中,如果文件不存在,则先创建一个新的空文件并覆盖 >> ...

  3. Linux环境安装MQ

    MQ下载地址:http://www-03.ibm.com/software/products/us/en/wmq/ 安装的MQ软件包为WMQv600Trial-x86_linux_2.tar.gz.  ...

  4. [部署]CentOS yum源

    安装yum源 一般的软件都会提供一个.rpm的软件包,使用rpm指令安装了这个包后会自动添加一个yum仓库源,之后用yum就可以安装该软件了. 安装rpm包 rpm -ivh http://repo. ...

  5. 22 扩展Python - 《Python 核心编程》

  6. [转]How to insert a row between two rows in an existing excel with HSSF (Apache POI)

    本文转自:http://stackoverflow.com/questions/5785724/how-to-insert-a-row-between-two-rows-in-an-existing- ...

  7. Uva10082 WERTYU -S.B.S.

    A common typing error is to place the hands on the keyboard one row to the right of the correct posi ...

  8. UESTC 880 生日礼物 --单调队列优化DP

    定义dp[i][j]表示第i天手中有j股股票时,获得的最多钱数. 转移方程有: 1.当天不买也不卖: dp[i][j]=dp[i-1][j]; 2.当天买了j-k股: dp[i][j]=max(dp[ ...

  9. Topcoder SRM 619 DIv2 500 --又是耻辱的一题

    这题明明是一个简单的类似约瑟夫环的问题,但是由于细节问题迟迟不能得到正确结果,结果比赛完几分钟才改对..耻辱. 代码: #include <iostream> #include <c ...

  10. Unity物理系统的触发器

    如何触发触发器函数? 触发器中相互的,当其中一个是触发器,两个物体进入碰撞,双方的触发器函数都会触发. 两个碰撞盒穿入? 解决办法:给其中一个添加刚体 触发器的物理配置 以上是个人理解,看过API之后 ...