仿微信小红圈消息提示App消息红圆点提示
代码:
<div class="wrap">
<div class="img"></div>
<div class="notice">1</div>
</div> <div class="wrap">
<div class="img"></div>
<div class="notice">12</div>
</div> <div class="wrap">
<div class="img"></div>
<div class="notice">13</div>
</div>
<style>
.wrap {
width:50px;
margin-bottom:10px;
position:relative;
}搜索
.img {
width:50px;
height:50px;
border:1px solid #000;
}
.notice {
width:20px;
height:20px;
line-height:20px;
font-size:10px;
color:#fff;
text-align:center;
background-color:#f00;
border-radius:50%;
position:absolute;
right:-10px;
top:-10px;
}
</style>
效果如下:
仿微信小红圈消息提示App消息红圆点提示的更多相关文章
- 微信小程序中发送模版消息注意事项
在微信小程序中发送模版消息 参考微信公众平台Api文档地址:https://mp.weixin.qq.com/debug/wxadoc/dev/api/notice.html#模版消息管理 此参考地址 ...
- Android BGABadgeView:新消息/未接来电/未读消息/新通知圆球红点提示(1)
Android BGABadgeView:新消息/未接来电/未读消息/新通知圆球红点提示(1) 现在很多的APP会有新消息/未接来电/未读消息/新通知圆球红点提示,典型的以微信.QQ新消息提示为 ...
- 微信小程序与传统APP十大优劣对比
随着微信公众平台的开放,微信端小程序涌现市场,带来很很多便利和简单的原生操作,询:微信端小程序是否会替代传统的APP应用?两者的优劣如何?我们一起来看看传统APP与微信端小程序十大优劣对比 ...
- 微信小程序与手机APP区别
微信小程序与手机APP区别 ------------------<><><><>------------------ 微信小程序自去年年初,张小龙放话要 ...
- 微信小程序中的app.js-清除缓存
微信小程序中的app.js 关于小程序app.js生命周期的介绍 App(Object) App() 函数用来注册一个小程序.接受一个 Object 参数,其指定小程序的生命周期回调等. App() ...
- Android 仿微信小视频录制
Android 仿微信小视频录制 WechatShortVideo和WechatShortVideo文章
- 微信小程序、安卓APP、苹果APP对比分析
今天的话题主要是关于微信小程序.安卓APP.苹果APP对比分析.既然是对比分析肯定是将它们一个一个说明. 本篇不涉及技术话题,只讲解微信小程序.安卓APP.苹果APP它们各自的优缺点及其应用场景. 一 ...
- 微信小程序唤起其他微信小程序 / 移动应用App唤起小程序
微信小程序唤起其他微信小程序 / 移动应用App唤起小程序 1. 微信小程序唤起微信小程序 小程序唤起其他小程序很简单 先上链接 小程序跳转小程序 Navigator组件 推荐使用 小程序跳转小程序 ...
- 微信小程序--仿微信小程序朋友圈Pro(内容发布、点赞、评论、回复评论)
微信小程序--仿微信小程序朋友圈Pro(内容发布.点赞.评论.回复评论) 项目开源地址M朋友圈Pro 求个Star 项目背景 基于原来的开源项目 微信小程序仿朋友圈功能开发(发布.点赞.评论等功能 ...
随机推荐
- js中字符串全部替换
废话不多说,直接发结果 在js中字符串全部替换可以用以下方法: str.replace(/需要替换的字符串/g,"新字符串") 比如: "yyyy-MM-dd-hh-mm ...
- python常用序列list、tuples及矩阵库numpy的使用
近期开始学习python机器学习的相关知识,为了使后续学习中避免编程遇到的基础问题,对python数组以及矩阵库numpy的使用进行总结,以此来加深和巩固自己以前所学的知识. Section One: ...
- js 时间戳 转化
new Date((1524142795*1000)).toJSON().slice(11,16)
- [DeeplearningAI笔记]序列模型2.10词嵌入除偏
5.2自然语言处理 觉得有用的话,欢迎一起讨论相互学习~Follow Me 2.10词嵌入除偏 Debiasing word embeddings Bolukbasi T, Chang K W, Zo ...
- OpenCV---图像金字塔原理
图像金字塔原理 (一)图像缩小(先高斯模糊,再降采样,需要一次次重复,不能一次到底) (二)图像扩大(先扩大,再卷积或者使用拉普拉斯金字塔) 图像金字塔介绍 图像金字塔是图像中多尺度表达的一种,最主要 ...
- Spring整合JMS(三)——MessageConverter介绍(转)
*注:别人那复制来的 1.4 消息转换器MessageConverter MessageConverter的作用主要有两方面,一方面它可以把我们的非标准化Message对象转换成我们的目标Me ...
- 1.redis设计与实现--简单动态字符串
1.redis没有使用c语言的字符串表示,而是使用更加适合自己的SDS(simple dynamic string),简单动态字符串,结构如下: 2.sys与c字符串的对比: 3.总结: redis采 ...
- HDU 4946 凸包
给你n个点,具有速度,一个位置如果有其他点能够先到,则不能继续访问,求出里面这些点哪些点是能够无限移动的. 首先我们考虑到,一个速度小的和一个速度大的,速度小的必定只有固定他周围的一定区域是它先到的, ...
- [Luogu 1967] NOIP2013 货车运输
[Luogu 1967] NOIP2013 货车运输 一年多前令我十分头大的老题终于可以随手切掉了- 然而我这码风又变毒瘤了,我也很绝望. 看着一年前不带类不加空格不空行的清纯码风啊,时光也好像回去了 ...
- linux命令df中df -h和df -i的区别
df 命令: linux中df命令的功能是用来检查linux服务器的文件系统的磁盘空间占用情况.可以利用该命令来获取硬盘被占用了多少空间,目前还剩下多少空间等信息. 1.命令格式: df [选项] [ ...