添加一个气泡

1、bootstrap 官网:http://getbootstrap.com/

2、bootstrap 中文官网:http://v3.bootcss.com/

添加气泡主要需要用到 bootstrap 的 徽章,具体实现方法如下:

首先在控制器中查出徽章中需要显示的那个数字

    /**
* @purpose : 查询出未审核的的评论数,作为气泡的值
* @return int|string
*/
public static function getPengDingCommentCount()
{
return Comment::find()->where(['status'=> 1])->count();
}

然后在视图文件中添加如下代码:

        // 主要用到了徽章 badge 这个class样式。用法: <span class="badge">值</span>
'<li><span class="badge">'.Comment::getPengDingCommentCount().'</span></li>',

注:本文为作者(44106-kangaroo) 看完魏羲教你学Yii2.0 视频后所记,如有转载请注明出处:http://www.cnblogs.com/chrdai/p/7999729.html

yii2 配合bootstrap添加一个气泡的更多相关文章

  1. yii2 配合bootstrap添加按钮

    新增一个按钮 1.bootstrap 官网:http://getbootstrap.com/ 2.bootstrap 中文官网:http://v3.bootcss.com/ 在视图文件中: <? ...

  2. yii2自带的backend,frontend不够用,添加一个后台模块怎么做?

    在复杂项目里,高级模板中的fontend.backend application明显不够,可以再添加另外的application. 例如添加一个seller application .步骤如下: 1, ...

  3. 利用vue-cli配合vue-router搭建一个完整的spa流程

    好文章备忘录: 转自:https://segmentfault.com/a/1190000009160934?_ea=1849098 demo源码:https://github.com/1590123 ...

  4. bootstrap开发一个简单网页。

    CSS代码: body{        padding-top: 50px;        padding-bottom: 50px;        overflow: auto!important; ...

  5. HTML&CSS基础学习笔记1.28-给网页添加一个css样式

    CSS是什么? 当HTML配合CSS一起使用时,我们发现页面变得好看了很多.那么CSS到底是什么呢? CSS指层叠样式表 (Cascading Style Sheets),它主要是用于定义HTML标签 ...

  6. Yii2如何批量添加数据

    批量添加这个操作,在实际开发中经常用得到,今天小编抽空给大家整理些有关yii2批量添加的问题,感兴趣的朋友一起看看吧. 在上篇文章给大家介绍了关于浅析Yii2 gridview实现批量删除教程,当然, ...

  7. bootstrap添加多个模态对话框支持

    bootstrap添加多个模态对话框支持 (2015-03-04 21:05:35) 转载▼ 标签: 房产   因为项目需要,在页面交互上要弹出多个dialog窗口,而bootstrap的modal支 ...

  8. linux下如何添加一个用户并且让用户获得root权限

    1.添加用户,首先用adduser命令添加一个普通用户,命令如下: #adduser tommy //添加一个名为tommy的用户 #passwd tommy //修改密码 Changing pass ...

  9. CSS3属性 box-shadow 向框添加一个或多个阴影

    CSS3属性 利用box-shadow制作网页页眉背景 box-shadow 浏览器支持 IE9+.Firefox 4.Chrome.Opera 以及 Safari 5.1.1 支持 box-shad ...

随机推荐

  1. 20165323 实验二 Java面向对象程序设计

    一.实验报告封面 课程:Java程序设计 班级:1653班 姓名:杨金川 学号:20165323 指导教师:娄嘉鹏 实验日期:2018年4月16日 实验时间:13:45 - 15:25 实验序号:二 ...

  2. 【C++ Primer | 11】关联容器(一)

    在multimap或multiset中查找元素 第二种方法解释: #include <iostream> #include <utility> #include <ite ...

  3. [转] webpack3最新版本配置研究(五) devtool,webpack-dev-server,CommonsChunkPlugin

    devtool devtool是webpack中config自带的属性只要使用就可以了不用安装 webpack官网的解释如下 当 webpack 打包源代码时,可能会很难追踪到错误和警告在源代码中的原 ...

  4. 【Android】ScaleAnimation 详解

    ScaleAnimation类是Android系统中的尺寸变化动画类,用于控制View对象的尺寸变化,该类继承于Animation类.ScaleAnimation类中的很多方法都与Animation类 ...

  5. 黑色半透明镂空遮罩指引效果实现jQuery小插件

    /*! * by zhangxinxu(.com) 2017-05-18 * 新版上线时候的黑色半透明镂空遮罩指引效果实现jQuery小插件 * 兼容到IE8+ * MIT使用协议,使用时候保留版权 ...

  6. html ie

    <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content=" ...

  7. JDK自带工具keytool生成ssl证书

    前言: 因为公司项目客户要求使用HTTPS的方式来保证数据的安全,所以木有办法研究了下怎么生成ssl证书来使用https以保证数据安全. 百度了不少资料,看到JAVA的JDK自带生成SSL证书的工具: ...

  8. Archive for required library: 'E:/repository/org/apache/ant/ant/1.7.1/ant-1.7.1.jar' in project 'test02' cannot be read or is not a valid ZIP file

    Archive for required library: 'E:/repository/org/apache/ant/ant/1.7.1/ant-1.7.1.jar' in project 'tes ...

  9. P1040 加分二叉树 区间dp

    题目描述 设一个nn个节点的二叉树tree的中序遍历为(1,2,3,…,n1,2,3,…,n),其中数字1,2,3,…,n1,2,3,…,n为节点编号.每个节点都有一个分数(均为正整数),记第ii个节 ...

  10. Python中GIL

    GIL(global interpreter lock)全局解释器锁 python中GIL使得同一个时刻只有一个线程在一个cpu上执行,无法将多个线程映射到多个cpu上执行,但GIL并不会一直占有,它 ...