html圆形头像的制作
<html>
<head>
<title>圆形头像的制作</title>
<style type="text/css">
.imgtest{margin:10px 5px;
overflow:hidden;}
.list_ul figcaption p{
font-size:12px;
color:#aaa;
}
.imgtest figure div{
display:inline-block;
margin:5px auto;
max-width:200px;
height:200px;
<!-- border-radius:100px; 此行代码让图片变圆 -->
border:2px solid #fff;
overflow:hidden;
-webkit-box-shadow:0 0 3px #ccc;
box-shadow:0 0 3px #ccc;
}
.imgtest img{width:100%;
min-height:100%; text-align:center;}
</style>
</head>
<body >
<div class="imgtest">
<figure>
<div>
<img src="http://db.zsmy.cn:8088/upload/authPic/2016/7/19/14689086514144647" />
</div>
</figure>
</div>
</body>
</html>
转载于:https://www.cnblogs.com/shihaiming/p/5765509.html
html圆形头像的制作相关推荐
- 利用 BitmapShader 制作自带边框圆形头像
目前为止,已经掌握了两种制作圆形头像的方法,一种是利用 PorterDuffXfermode,一种是 Shader 工具.至于选择哪一种方法因人而异,但幸运的是这两种方法的使用都并不难.好了,现在介绍 ...
- Android开发之制作圆形头像自定义View,直接引用工具类，加快开发速度。带有源代码学习
作者:程序员小冰,CSDN博客:http://blog.csdn.net/qq_21376985 QQ986945193 博客园主页:http://www.cnblogs.com/mcxiaobing ...
- Android开发之制作圆形头像自定义View,直接引用工具类，加快开发速度。带有源代码学习...
作者:程序员小冰,CSDN博客:http://blog.csdn.net/qq_21376985 QQ986945193 博客园主页:http://www.cnblogs.com/mcxiaobing ...
- WordPress制作圆形头像友情链接页面的方法
网上看见过很多种友情链接页面,我比较喜欢的是圆形头像的这种,先看看效果吧:传送门 就是这种上面是圆形的友链用户头像,下面是友链用户网站名,然后鼠标移上去头像会旋转,怎么实现这种效果呢?我在网上找了很多 ...
- android 清空canvas部分内容_Android自定义View实现圆形头像效果
在我们的APP中通常会遇到,展示圆形头像的需求,一般通过Glide就能实现,但是让我们做一个圆形头像,如果让我们自定义实现这种效果,该怎样做呢? 好,接下来本文通过三种方式来实现这种效果! 注意:这是 ...
- html img 圆头像_纯CSS3炫酷圆形头像图片过滤特效
这是一款效果非常酷的纯CSS3炫酷圆形头像图片过滤特效.该特效将图片制作为圆形图片,以网格形式布局,带点击相应的分类按钮后,该类别的图片被放大显示,其它类别的图片被缩小,效果非常的不错. 制作方法 H ...
- Android自定义View之圆形头像
记录贴 现在制作圆形头像的第三方工具已经很多了,本帖只为记录自定义view学习过程. 1.主体代码部分 public class CirclePhotoView extends View {priva ...
- ios 裁剪圆形头像_iOS开发笔记：实现圆形头像
初学iOS,记录一下自己遇到的一些问题,也希望能够对别人有所帮助 一般应用的个人头像如上图,圆形头像算是每款App中最常见的东西了,刚好最近有遇到这个问题,并且顺利解决了,其实很简单,调用layer这 ...
- android开发之 - 圆形头像
//最新第三方圆形头像: https://github.com/hdodenhof/CircleImageView https://github.com/MostafaGazar/CustomShap ...
- iOS开发之裁剪圆形头像
2019独角兽企业重金招聘Python工程师标准>>> - (void)viewDidLoad {[super viewDidLoad];//加载图片UIImage *image = ...
最新文章
- 计算机二级考试常用代码,二级计算机VB考试常用代码(看完必过).doc
- python的openpyxl库如何读取特定列_通过渲染一百万个网页，来了解网络是如何崩溃的...
- 简单tarjan》一道裸题（BZOJ1051）（easy）
- hive 导入mysql数据库_求助 Hive 导入MYsql 数据库 报错啊
- [Android Pro] 终极组件化框架项目方案详解
- 天玑720支持鸿蒙系统吗,天玑720属于骁龙多少 天玑720处理器相当于骁龙几
- 会动的图解 (二) 怎么让goroutine跑一半就退出？
- mysql要将语句反复执行15次_MySQL多表查询疑问
- 大数据之-入门_大数据特点(4V)---大数据之hadoop工作笔记0003
- FreeRTOS源码分析与应用开发10：内存管理
- 学术必备 | 论文写作中注意这些细节，能显著提升成稿质量
- html基础—页面框架,前端基础——页面架构
- kubernetes 删除容器 docker rmi Error response from daemon: conflict: container is using its referenced
- 斯皮尔曼相关系数计算的python代码
- Excel 列累加技巧
- 互动课件制作 html,如何实现多图版互动式图片课件的制作
- 实战项目一、安居客(北京) 二手房抓取房源信息
- pn532检测不到nfc设备_华为、小米又增回NFC功能，苹果却一直无NFC功能，NFC能否成为关键？...
- 2006电子商务大盘点
- 浅析3种电池容量监测方案