border-radius 圆角
border-radius:3px; 参数的单位可以使绝对的像素px,也可以用相对单位%;
参数顺序是左上角,右上角,右下角,左下角.
圆角:
div{width: 100px;height: 100px;border: 1px solid #6c6;border-radius: 50%;}

不同设置:
div{
width: 100px;
height: 100px;
border: 1px solid #6c6;
border-radius:20px 0 0 0;
border-radius:20px 20px 0 0; /**/
border-radius:20px 20px 20px 0;/**/
border-radius:0 20px 0 20px; /**/
}

过渡效果:
.hex{
width: 100px;
height: 100px;
border-radius: 50%;
box-shadow:0 0 0 1px #ccc inset;
transition:box-shadow 0.5s linear;
}
.hex:hover{
box-shadow: 0 0 0 16px #039 inset;
}

border-radius 圆角的更多相关文章
- WPF 采用Border创建圆角
通过设置可以创建圆角border的CornerRadius属性其边框呈现圆角样式 代码: <Border Height="50" Background="Red&q ...
- 使用ToggleButton和StackPanel+Border实现圆角开关按钮动画效果
<ToggleButton Height=" HorizontalAlignment="Left" Margin="138,122,0,0" N ...
- 利用CSS3实现圆角的outline效果的教程
一.首先,outline是个很牛的东西1. border近亲outline和border是近亲,为什么这么讲呢?首先,都是给元素外面套框框的:其次,支持的属性值几乎都是一样的,例如,outline-s ...
- iOS 高效添加圆角效果实战讲解
圆角(RounderCorner)是一种很常见的视图效果,相比于直角,它更加柔和优美,易于接受.但很多人并不清楚如何设置圆角的正确方式和原理.设置圆角会带来一定的性能损耗,如何提高性能是另一个需要重点 ...
- 重温CSS:Border属性
边界是众所周知的,有什么新的东西吗?好吧,我敢打赌,在这篇文章中,有很多你不看永远不知道的东西! 不仅可以用CSS3来创建圆角,使用原有CSS一样可以显示自定义图形.这是正确的(有待考究):在过去,没 ...
- CSS如何实现圆角的outline效果?
一.首先,outline是个很牛逼的东西 温故而知鑫,10年的时候写过一篇可用性方面的文章:“页面可用性之outline轮廓外框的一些研究”,还算挺有用的:3年之后,也就是13年,介绍了个没什么使用价 ...
- iOS开发-添加圆角效果高效实现
圆角(RounderCorner)是一种很常见的视图效果,相比于直角,它更加柔和优美,易于接受.但很多人并不清楚如何设置圆角的正确方式和原理.设置圆角会带来一定的性能损耗,如何提高性能是另一个需要重点 ...
- CSS 笔记——阴影、圆角、旋转、光标
7. 阴影.圆角.旋转.光标 (1)box-shadow 阴影 基本语法 text-shadow: h-shadow v-shadow blur color; box-shadow: h-shadow ...
- CSS3边框与圆角
1. CSS3 圆角 border-radius 属性 一个最多可指定四个border -*- radius属性的复合属性,这个属性允许你为元素添加圆角边框!语法:border-radius: 1-4 ...
- css 边框和圆角
CSS3圆角 border-radius属性 一个最多指定四个border -*- radius复合属性,这个属性允许你为元素添加圆角边框 语法 border-radius:1-4 length|% ...
随机推荐
- Android开发技巧——自定义控件之自定义属性
Android开发技巧--自定义控件之自定义属性 掌握自定义控件是很重要的,因为通过自定义控件,能够:解决UI问题,优化布局性能,简化布局代码. 上一篇讲了如何通过xml把几个控件组织起来,并继承某个 ...
- 基于opencv的gpu与cpu对比程序,代码来自opencv的文档中
原文链接: http://www.opencv.org.cn/opencvdoc/2.3.2/html/doc/tutorials/gpu/gpu-basics-similarity/gpu-basi ...
- 史上最简单的C语言链表实现,没有之一
#include <stdio.h> #include <string.h> #include <stdlib.h> #define NR(x) (sizeof(x ...
- 使用kubeadm搭建Kubernetes(1.10.2)集群(国内环境)
目录 目标 准备 主机 软件 步骤 (1/4)安装 kubeadm, kubelet and kubectl (2/4)初始化master节点 (3/4) 安装网络插件 (4/4)加入其他节点 (可选 ...
- partition List(划分链表)
Given a linked list and a value x, partition it such that all nodes less than x come before nodes gr ...
- access登录校验代码二
' 这一段是用来检查有没有输入用户名或密码的If IsNull(Trim(Me.username )) ThenDoCmd.BeepMsgBox ("请输入用户名称! ")Else ...
- 在Windows上安装Git
实话实说,Windows是最烂的开发平台,如果不是开发Windows游戏或者在IE里调试页面,一般不推荐用Windows.不过,既然已经上了微软的贼船,也是有办法安装Git的. Windows下要使用 ...
- Amazing iOS Tips
先开个题,慢慢加内容: 准备参考的资料 https://github.com/Aufree/trip-to-iOS https://github.com/vsouza/awesome-io ...
- Django单元测试简明实践
1.准备数据模式,Django空库测试需要所有相关数据模式必须在Django中定义,说白了,model不能有managed=Fasle,为了解决这个问题,你必须得有一个managed全部为True的S ...
- gitolite服务器部署中的一些坑
1.秘钥登录问题可参考< 安装gitolite,并ssh公钥无密码登录>http://www.cnblogs.com/tr0217/p/4517952.html,该文中推荐了阮一峰的< ...