很多场景下需要对元素加入圆圈。但光靠border-radius其实还要调很久，所以做一下笔记

  1. #binggan .mui-icon {
  2.     display: inline-block;
  3.     margin: 3px;
  4.     margin: 15px 15px 0;
  5.     padding-top: 9pt;
  6.     width: 50px;
  7.     height: 50px;
  8.     border: 1px dashed #ddd;
  9.     border-radius: 25px;
  10.     background-color: #fff;
  11.     background-clip: padding-box
  12. }

Html - 圆圈border的更多相关文章

  1. 1_2_3_4_5 Html-Css

    --------------------------------------------------------------------------------- HTML骨架 <HTML> ...

  2. CSS魔法（二）

    # 文档类型<!DOCTYPE> <!DOCTYPE html> # 字符集 <meta charset="UTF-8" /> # 换行标签 & ...

  3. CSS3动画产生圆圈由小变大向外扩散的效果

    涉及到 CSS3 的动画(animation).2D 转换(transform: scale),具体如代码所示. github: https://github.com/wind-stone/CSS3- ...

  4. CSS实现圆角，三角，五角星，五边形，爱心，12角星，8角星，圆，椭圆，圆圈，八卦

    转自:http://blog.csdn.net/chenhongwu666/article/details/38905803 CSS实现圆角,三角,五角星,五边形,爱心,12角星,8角星,圆,椭圆,圆 ...

  5. CSS3创建圆圈进度条

    最近在工作中需要做一个圆圈倒计时,刚开始的想法是做个纯数字的倒计时即可,可是需求觉得这个不太好看,想加个倒计时进度条.于是就有了接下来的分析过程... 我们知道CSS3可以很方便的画圆,圆环,然后在加 ...

  6. 一款由html5 canvas实现五彩小圆圈背景特效

    之前介绍了好几款html5 canvas实现的特效.今天要为大家介绍一款由html5 canvas实现五彩小圆圈背景特效.五彩的小圆圈渐显渐失的特效.效果图如下: 在线预览   源码下载 html代码 ...

  7. canvas - 圆圈内 hover 高亮 效果

    各种计算还挺繁琐的, 关键点在角度的计算, 根据鼠标位置, 利用atan(y/x) 得到反正切值 , 角度  (tan输入的是r和x围成的那个角,输出的是y/x.反tan就是输入y/x输出角.) &l ...

  8. 理解CSS边框border

    前面的话   边框是CSS盒模型属性中默默无闻的一个普通属性,CSS3的到来,但得边框属性重新焕发了光彩.本文将详细介绍CSS边框 基础样式   边框是一条以空格分隔的集合样式,包括边框粗细(边框宽度 ...

  9. css样式之border

    border用法详解: 1.border-width 属性设置边框的宽度 可能的值:像素 2.border-style 属性设置边框的样式 可能的值:solid(直线),dashed(虚线),dott ...

随机推荐

  1. Mysql DDL与DML

    1,文件导入:LOAD DATA INFILE '/tmp/pet.txt' INTO TABLE pet FIELDS TERMINATED BY ',' LINES TERMINATED BY ' ...

  2. javascript reduce map函数方法

    retduce: 对数组中的所有元素调用指定的回调函数.该回调函数的返回值为累积结果,并且此返回值在下一次调用该回调函数时作为参数提供. 语法     array1.reduce(callbackfn ...

  3. Java开发中程序和代码性能优化

    现在计算机的处理性能越来越好,加上JDK升级对一些代码的优化,在代码层针对一些细节进行调整可能看不到性能的明显提升, 但是我觉得在开发中注意这些,更多的是可以保持一种性能优先的意识,对一些敲代码时间比 ...

  4. php动态安装mongo扩展

    首先下载mongo扩展包  http://pecl.php.net/package/mongo 开始安装把 wget http://pecl.php.net/get/mongo-1.5.8.tgz t ...

  5. Java Hour 42 fastjson

    fastjson 神一样的存在,然后由于缺乏文档,很多功能完全不知道该怎么用. 42.1 字段的大小写问题 刚开始没想到会因为字段的大小写问题而导致反序列化json 失败. @Override pub ...

  6. loj 1308(点双连通分量应用）

    题目链接:http://acm.hust.edu.cn/vjudge/problem/viewProblem.action?id=27016 题意:求一个连通图去掉任意一个点以及与它相连的边,图中的所 ...

  7. asp.net控件开发基础(1)（转）原文更多内容

    asp.net本身提供了很多控件,提供给我们这些比较懒惰的人使用,我认为控件的作用就在此,因为我们不想重复工作,所以要创建它,这个本身便是一个需求的关系,所以学习控件开发很有意思. wrox网站上有本 ...

  8. js:数据结构笔记5--链表

    数组: 其他语言的数组缺陷:添加/删除数组麻烦: js数组的缺点:被实现为对象,效率低: 如果要实现随机访问,数组还是更好的选择: 链表: 结构图: 基本代码: function Node (elem ...

  9. ember.js:使用笔记3 活用{{bind-attr}}

    说明:属性值绑定(属性值有无引号都可以) 如果是非布尔值: 一般使用,绑定其值; 使用冒号时,绑定名称,如 :high -> high; 如果是布尔值: 如果值是true,绑定其名,这里要注意驼 ...

  10. 字符串集合或字符串数组转换成json数组

    字符串可以是List<String>类型的字符串集合,也可以是String[]类型的字符串数组,二者转换成JSON数组的方式没有什么不同.下面代码注意关键的部分即可(画红线部分). 1. ...