【笔记】消息数量提示图标

简介: 消息数量提示图标

静态:

.box:before{content:"hello";}

css3 里面的content 可以使用动态内容结合html5的自定义属性:

// html
<div class="box" :data-text="num">...</div>
// css
.box:before{content:attr(data-text);} /* data-text 是自定义属性 */

当然,element-ui已经有了相应组件:
https://element.faas.ele.me/#/zh-CN/component/badge
在这里插入图片描述

在这里插入图片描述

在这里插入图片描述
在这里插入图片描述


拓展阅读:

相关文章
|
Go Android开发
autojs发送通知修改图标
牙叔教程 简单易懂
660 0
|
5月前
|
搜索推荐
【sgUploadTray_v2】自定义组件:升级版上传托盘自定义组件,可实时查看上传列表进度,可以通过选项卡切换上传中、成功、失败的队列,支持翻页,解决了列表内容太多导致卡顿的情况。(一)
【sgUploadTray_v2】自定义组件:升级版上传托盘自定义组件,可实时查看上传列表进度,可以通过选项卡切换上传中、成功、失败的队列,支持翻页,解决了列表内容太多导致卡顿的情况。
【sgUploadTray_v2】自定义组件:升级版上传托盘自定义组件,可实时查看上传列表进度,可以通过选项卡切换上传中、成功、失败的队列,支持翻页,解决了列表内容太多导致卡顿的情况。(一)
|
5月前
如何解决由引起的IQKeyboardManager部分页面返回的键盘高度比实际小或最后收到键盘隐藏通知却显示了键盘问题
如何解决由引起的IQKeyboardManager部分页面返回的键盘高度比实际小或最后收到键盘隐藏通知却显示了键盘问题
60 0
|
5月前
|
iOS开发
个推发送消息各字段在系统状态栏显示的信息,点击消息图标激活应用传递的信息,应用在线收到的透传消息信息
个推发送消息各字段在系统状态栏显示的信息,点击消息图标激活应用传递的信息,应用在线收到的透传消息信息
51 0
|
小程序 前端开发 JavaScript
微信小程序分类菜单激活状态跟随列表滚动自动切换
微信小程序分类菜单激活状态跟随列表滚动自动切换
156 0
微信小程序分类菜单激活状态跟随列表滚动自动切换
|
小程序 开发工具 开发者
微信小程序订阅消息点了 “总保持以上选择、全部拒绝,不在询问” 无法再次弹出
微信小程序订阅消息点了 “总保持以上选择、全部拒绝,不在询问” 无法再次弹出
1241 0
|
数据安全/隐私保护 iOS开发 芯片
将任意应用窗口置顶显示,这个工具太强了。
将任意应用窗口置顶显示,这个工具太强了。
|
JavaScript 前端开发 数据安全/隐私保护
聊天信息框显示消息
本文讲解如何制作,可以提交信息的聊天框,并且可以删除已经发布的聊天信息。
105 0
聊天信息框显示消息
|
前端开发
前端工作总结107-修改记录取消文本提示ele提示
前端工作总结107-修改记录取消文本提示ele提示
122 0
|
存储 JavaScript 前端开发
项目实战:弹出广告任意页面展示
弹出广告任意页面展示
186 0
下一篇
无影云桌面