css 设置圆角

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%;
　 }

效果：

支持性：

时间： 2024-10-18 06:42:34

css 设置圆角的相关文章

网页设计入门--如何使用css设置圆角

下面是我用html+css执行出来的结果,图片的圆角在不同的位置: 对应的代码如下: 1 <html> 2 <head> 3 <title>my first text html</title> 4 <style type="text/css"> 5 .yuanjiao{ 6 width:400px; 7 height:100px; 8 text-align:center; 9 background:#33CC33; 10 bo

CSS 设置圆角div和阴影效果

</pre><pre name="code" class="html"><!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> </head> <body> <div class="div&q

css——设置圆角border-radius值为50%安卓各版本会变形

参考: https://blog.csdn.net/lilinoscar/article/details/80539725 需求:tab切换,选项高亮. 原css:圆圈元素会有的扁,有的圆.刚开始审查元素时发现border超出,以为是这个问题.后来参考文章后发现是单位问题. .cirlce { width: .3rem; height: .3rem; border-radius: 50%; border: 1px solid #ccc; } .cirlce.active { border: 1p

转载自前端开发：CSS设置滚动条样式

浏览器默认的滚动条样子太过屌丝了,得自己动手整整.记得IE浏览器有几个设置滚条的样式,不过比较鸡肋,只能设置颜色之类的,而且webkit下面也不支持.无意间看到网易邮箱的滚动条样子很好看,一开始以为是用div模拟的,结果一看,吼吼,正合我意,利用的CSS来设置的,而且是webkit浏览器的. 得好好研究这几个属性下,才能自己动手改造. webkit浏览器css设置滚动条 主要有下面7个属性 ::-webkit-scrollbar 滚动条整体部分,可以设置宽度啥的 ::-webkit-scroll

由如何设置圆角按钮引发的思考

??你是不是觉得谷歌官方的按钮很丑呢?哈哈~~这里就如何给按钮设置圆角提供一些思路: ??在Android中,给一个控件(或View)设置背景主要是通过background:xxx属性来完成.background的参数一般来说是一个drawable资源. drawable可以是一张普通的图片,也可以是9 patch图片,还可以是一个xml文件. 方法1:图片 ??给控件设置边框最简单的方式就是把background设置成你预先设计好的带圆角和边框的背景图. ??但是,你很快会发现一个缺点:灵活性

设置圆角的弧度，保持兼容性

-webkit-border-radius:苹果:谷歌,等一些浏览器认,因为他们都用的是webkit内核:-moz-border-radius:moz这个属性 主要是专门支持Mozilla Firefox 火狐浏览器的CSS属性.在这两个属性有值的时候,去掉哪个属性,对用他们做内核的浏览器就有影响 设置圆角的弧度 -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px;

纯CSS设置Checkbox复选框控件的样式

下面是纯CSS设置Checkbox复选框控件的五种简单样式,有兴趣的可以进行改动将其变成自己想要的样式. 首先,需要添加一段CSS隐藏所有的Checkbox复选框,下面我们会改变它的外观.要做到点需要添加一段代码到你的CSS文件中. 隐藏掉所有的Checkbox复选框后,我们需要添加一个label HTML元素,我们都知道,当点击的有for属性的label标签时,对应的Checkbox复选框会被选中.这意味着,我们可以通过label的点击事件来处理我们的Checkbox复选框. 样式一 此复选框

CSS设置滚动条样式

因为在现在的大部分项目中很多都用到了滚动条,有时候用到模拟的滚动条,现在说下滚动条的CSS也能解决. 比如网易邮箱的滚动条样子很好看,就是利用的CSS来设置的,而且是webkit浏览器的.如图所示: 下面就讲解这几个属性怎么使用,代表什么意思. 一:webkit下面的CSS设置滚动条 主要有下面7个属性 ::-webkit-scrollbar 滚动条整体部分,可以设置宽度啥的 ::-webkit-scrollbar-button 滚动条两端的按钮 ::-webkit-scrollbar-trac

CSS设置滚动条样式[转]

原文转载地址:http://www.javascript100.com/?p=756 webkit浏览器css设置滚动条 主要有下面7个属性 ::-webkit-scrollbar 滚动条整体部分,可以设置宽度啥的 ::-webkit-scrollbar-button 滚动条两端的按钮 ::-webkit-scrollbar-track  外层轨道 ::-webkit-scrollbar-track-piece  内层滚动槽 ::-webkit-scrollbar-thumb 滚动的滑块 ::-