CSS3 圆角(border-radius)

  • -moz(例如 -moz-border-radius)用于Firefox
  • -webkit(例如:-webkit-border-radius)用于Safari和Chrome。

 example:

  <span class="pull-left col-xs-3 user-face">

<img class="media-object img-thumbnail" ng-src="${ctx!}/images/student/card/default_40.png">

</span>

  .user-face img{
      -moz-border-radius:50%;
      -webkit-border-radius: 50%;
      border-radius: 50%;
  }

效果:

支持性:

css 设置圆角的更多相关文章

  1. CSS设置DIV边框为圆角,添加背景色溢出的问题

    这么几天需要做一个类似于层级展示的东西,最后一层需要做一些div框来展示数据,我用css设置了div的边框为圆角,但是添加背景色的时候颜色溢出,覆盖了四个角的圆弧,效果如图所示: css代码如下: . ...

  2. CSS设置滚动条样式

    因为在现在的大部分项目中很多都用到了滚动条,有时候用到模拟的滚动条,现在说下滚动条的CSS也能解决. 比如网易邮箱的滚动条样子很好看,就是利用的CSS来设置的,而且是webkit浏览器的.如图所示: ...

  3. CSS设置滚动条样式[转]

    原文转载地址:http://www.javascript100.com/?p=756 webkit浏览器css设置滚动条 主要有下面7个属性 ::-webkit-scrollbar 滚动条整体部分,可 ...

  4. 转载自前端开发:CSS设置滚动条样式

    浏览器默认的滚动条样子太过屌丝了,得自己动手整整.记得IE浏览器有几个设置滚条的样式,不过比较鸡肋,只能设置颜色之类的,而且webkit下面也不支持.无意间看到网易邮箱的滚动条样子很好看,一开始以为是 ...

  5. webkit下面的CSS设置滚动条

    webkit下面的CSS设置滚动条 1.主要有下面7个属性: ::-webkit-scrollbar 滚动条整体部分,可以设置宽度啥的 ::-webkit-scrollbar-button 滚动条两端 ...

  6. 清除webkit浏览器css设置滚动条

    主要有下面7个属性 ::-webkit-scrollbar 滚动条整体部分,可以设置宽度啥的 ::-webkit-scrollbar-button 滚动条两端的按钮 ::-webkit-scrollb ...

  7. css样式圆角和一定的透明度

    css样式里可以用border-radius把div或图片变成带有一定圆角的,如果是div本身是正方形,设置圆角度是百分之五十,就是圆形. border-radius:值可以是具体的px数值,也可以是 ...

  8. img只显示图片一部分 或 css设置背景图片只显示图片指定区域

    17:14 2016/3/22img只显示图片一部分 或 css设置背景图片只显示图片指定区域 background-position: 100% 56%; 设置背景图片显示图片的哪个坐标区域,图片左 ...

  9. css 设置背景图片模糊,内容不模糊

    需求:一个div设置了background: url,现在需要使图片背景模糊,div内的文字清晰显示. 原始代码: <!DOCTYPE html> <html lang=" ...

随机推荐

  1. jvm死锁解决

    那我们怎么确定一定是死锁呢?有两种方法. 1>使用JDK给我们的的工具JConsole,可以通过打开cmd然后输入jconsole打开. 1)连接到需要查看的进程.

  2. android:layout_height、android:layout_width、android:height、android:width的关系与区别

    一直一来对android:layout_height.android:layout_width.android:height.android:width这几个属性的关系有些不理解,既然有了androi ...

  3. css-单位%号-background-size-background-position-遁地龙卷风

    (-1)写在前面 我用的是chrome49,这篇是为后续做准备.重要性的调整以及毕业资料的整体导致最近没看JQuery和H5特效,以后只能晚上看了. (0)准备 div长宽都为300px,我们一张大小 ...

  4. Maven 入门 (1)—— 安装

    Maven 入门 (1)—— 安装 http://blog.csdn.net/kakashi8841/article/details/17371837 1.下载maven安装包 http://mave ...

  5. PHP中计划任务

    PHP不支持多线程,有时候处理问题不是那么爽,今天谈论一下PHP定时执行的方法 PHP定时执行的三种方式实现 .windows 的计划任务 .linux的脚本程序 .让web浏览器定时刷新 windo ...

  6. Spring Data JPA @EnableJpaRepositories配置详解

    @EnableJpaRepositories注解用于Srping JPA的代码配置,用于取代xml形式的配置文件,@EnableJpaRepositories支持的配置形式丰富多用,本篇文章详细讲解. ...

  7. Oracle分析函数(一)

    一.总体介绍 分析函数如何工作 语法 FUNCTION_NAME(<参数>,…) OVER (<PARTITION BY 表达式,…> <ORDER BY 表达式 < ...

  8. 解决SprngMVC中ResponseBody注解中文乱码

    配置文件前面加入如下结构,版本号3.2.5 <bean class="org.springframework.web.servlet.mvc.method.annotation.Req ...

  9. Ehlib安装方法有窍门

    Ehlib安装方法有窍门,如果不知道该安装方法,很难成功安装,Delphi 7(D5.D6也如此)中的安装方法       1.把EhLib中的common和DataService文件拷贝到Delph ...

  10. UML大战需求分析——阅读笔记02

    类图是理解面向对象思想的强有力工具,也是业务概念模型分析中最常用的一种UML图.对开发人员来说,并不是对每一个业务流程都很熟练,在客户那里传达过来的需求资料中,有很多术语会把思绪搞晕,他们之间错综复杂 ...