https://segmentfault.com/q/1010000006551803?_ea=1074082

<html>
<style>
#a1 {
width: 200px;
height: 200px;
background-color: #333;
color: #fff;
position: relative;
margin-top: 50px;
}

#a1:after {
content: attr(data-num);
line-height: 50px;
text-align: center;
width: 50px;
height: 50px;
border-radius: 50%;
background-color: red;
position: absolute;
top: -20px;
right: -20px;
}
</style>
<body>

<div data-num='22' id="a1">33333</div>

</body>
</html>

html如何给图片加角标的更多相关文章

  1. iOS nav加角标

    写一个类别加上就可以啦 #import "UIBarButtonItem+Badge.h" #import "BadgeView.h" #import < ...

  2. iOS 未读消息角标 仿QQ拖拽 简单灵活 支持xib(源码)

    一.效果 二.简单用法 超级简单,2行代码集成:xib可0代码集成,只需拖一个view关联LFBadge类即可 //一般view上加角标 _badge1 = [[LFBadge alloc] init ...

  3. Android 为应用添加数字角标

    今天在论坛上看到了一个帖子,终于搞清了我很久以来的一个困惑,android到底能不能实现ios的角标效果,QQ是怎么实现的.看了这个帖子顿时终于解除了我的困惑. 先说一个下大概的思路: 大家都知道an ...

  4. Android之图片加载框架Fresco基本使用(二)

    PS:最近看到很多人都开始写年终总结了,时间过得飞快,又到年底了,又老了一岁. 学习内容: 1.进度条 2.缩放 3.ControllerBuilder,ControllerListener,Post ...

  5. 从代码分析Android-Universal-Image-Loader的图片加载、显示流程

    从UNIVERSAL IMAGE LOADER. PART 3(四个DisplayImage重载方法详解)中,我们学习了Android-Universal-Image-Loader(以下简称UIL)中 ...

  6. Android Fresco (Facebook开源的图片加载管理库)

    Fresco是Facebook开源的一个图片加载和管理库. 这里是Fresco的GitHub网址. 同类型的开源库市面有非常多,比如Picasso, Universal Image Loader, G ...

  7. 通知角标(2)只用一个TextView实现

    可以只用一个TextView实现通知角标,TextView的setCompoundDrawables函数可以在TextView的上,下,左,右,4条边处分别指定一个图片.见图1: 这个图片如果在角上, ...

  8. MIUI6&7桌面角标开源代码简介

    MIUI6&7桌面角标开源代码简介 MIUI6&7上重新设计了桌面app图标的角标显示,基本规则如下: 一.基本介绍 1.默认的情况 当app 向通知栏发送了一条通知 (通知不带进度条 ...

  9. css实现角标

    效果图: 简单方式可以使用背景图片,但这里我使用的css来实现,最笨的方式是使用矩形div然后旋转遮挡就可以, <div class='checked-item'>    角标实现 < ...

随机推荐

  1. ecshop安装

    ECSHOP开发中心(www.68ecshop.com) 1.下载ecshop程序包,下载地址: http://download.ecshop.com/2.7.3/ECShop_V2.7.3_UTF8 ...

  2. python 类属性 、实例属性，可变数据结构作为类属性需要注意的地方

    1.一些经典的python错误不去阅读和不重视,就会把错误的做法带入到实际项目中来,甚至造成难以排查问题. 2.有一个大笨猪,按java写观察者模式,java写得是直接在类名下声明一个实例属性(不加s ...

  3. Java虚拟机（三）：Java 类的加载机制

    1.什么是类的加载 类的加载指的是将类的.class文件中的二进制数据读入到内存中,将其放在运行时数据区的方法区内,然后在堆区创建一个java.lang.Class对象,用来封装类在方法区内的数据结构 ...

  4. SpringMVC由浅入深day02_7上传图片

    7 上传图片 7.1 需求 在修改商品页面,添加上传商品图片功能. 7.2 springmvc中对多部件类型解析 在页面form中提交enctype="multipart/form-data ...

  5. window.location.href

    WEB设置首页 <welcome-file-list> <welcome-file>index.html</welcome-file> </welcome-f ...

  6. actor mysql 持久化之 specified actor

    持久化到mysql,要求一次操作涉及到的多次读写的事务性.使用的 library 是 postgresql-async, akka 版本是 2.11. 1. 实现 per-user 逻辑,简单来讲,就 ...

  7. HTML开发之（块级标签，行内标签，行内块标签）

    显示模式的特性: 主要分为两大类: 块级元素:独占一行,对宽高的属性值生效:如果不给宽度,块级元素就默认为浏览器的宽度,即就是100%宽: 行内元素:可以多个标签存在一行,对宽高属性值不生效,完全靠内 ...

  8. 使用 requests 维持会话

    什么是 Cookie 和 Session: 简单来说,我们访问每一个互联网页面,都是通过 HTTP 协议进行的,而 HTTP 协议是一个无状态协议,所谓的无状态协议即无法维持会话之间的状态.比如,仅使 ...

  9. shell中判断是否是月末的方法

    判断今天是不是一月的最后一天: 如果$(TZ=IST-32 date +%d)是1就是月末了.

  10. iOS - 转场时 appear 与 disappear 的调用顺序探索

    不同的转场方式 A.B viewDidDisappear调用的流程不同 在A页面跳转到B页面的过程中 A 的 viewDidDisappear 方法和 B 的 viewDidAppear 谁先调用? ...