http://blog.sina.com.cn/s/blog_61671b520101gelr.html

border-radius

border-radius: 50px 20px;上下都是50px,左右是20px

border-radius:50px 0px 30px; 上50px 左右0px 下30px;

圆和椭圆的区别在于,椭圆的长短半轴不相等

border-radius还可以用斜杠设置第二组值。这时,第一组值表示水平半径,第二组值表示垂直半径。第二组值也可以同时设置1到4个值,应用规则与第一组值相同

即 border-radius: <length> <length> <length> <length>/<length> <length> <length> <length>

看图比较清楚

border-radius : 10px 30px 50px / 10px 30px 50px;此时是长短半轴相等

border-radius : 50px/80px;

border-radius : 10px  30px 50px / 30px 50px 70px;

 
 
 
 

border-right-color:#fff;   border-radius:50%;   如果全是border,width和height为0

-------------------------------------box-shadow------------------------------------

css3学习--border的更多相关文章

  1. CSS3学习之圆角box-shadow,阴影border-radius

    最近经常玩腾讯微博,出来职业习惯,看看它的CSS,里面运用了大量的css3的东东,有一处用到了Data URI,还有css e­xpression有争议的地方,对png24图片的处理也是用滤镜,类似( ...

  2. CSS3学习笔记(3)-CSS3边框

    p{ font-size: 15px; } .alexrootdiv>div{ background: #eeeeee; border: 1px solid #aaa; width: 99%; ...

  3. HTML5与CSS3权威指南之CSS3学习记录

    title: HTML5与CSS3权威指南之CSS3学习记录 toc: true date: 2018-10-14 00:06:09 学习资料--<HTML5与CSS3权威指南>(第3版) ...

  4. HTML5 CSS3学习

    HTML5 CSS3学习 :http://www.1000zhu.com/course/css3/ HTML5 相关书籍:   http://www.html5cn.com.cn/news/gdt/2 ...

  5. css和css3学习

    css和css3学习 css布局理解 css颜色大全 样式的层叠和继承 css ::before和::after伪元素的用法 中文字体font-family常用列表 cursor属性 css选择器 F ...

  6. CSS3学习总结——实现瀑布流布局与无限加载图片相册

    首先给大家看一下瀑布流布局与无限加载图片相册效果图: 一.pic1.html页面代码如下: <!DOCTYPE html> <html> <head> <me ...

  7. 十天精通CSS3学习笔记 part4

    CSS3中的变形与动画(下) CSS3 Keyframes介绍 Keyframes 被称为关键帧,其类似于Flash中的关键帧.在CSS3中其主要以"@keyframes"开头,后 ...

  8. CSS3学习笔记1-选择器和新增属性

    前言:之前自学了一些关于CSS3的知识,在学习过程中也遇到过坑,不过总算磕磕绊绊的学习完了关于CSS3的相关知识,于是最近把之前的笔记和代码整理了一下,也算是一个对CSS3知识的回顾复习吧,也希望能够 ...

  9. CSS3学习内容与心得

    今天2005年7月9号,博客这个东西还真不懂,以前吧我不认识它,它也不认识我.没辙,汤老要我们写,就写吧. 写什么好呢?那就写今天学习的css3的一些要点吧. css这门课程几乎都学完了.而我觉得我还 ...

随机推荐

  1. HTML5新特性之Mutation Observer

    Mutation Observer(变动观察器)是监视DOM变动的接口.当DOM对象树发生任何变动时,Mutation Observer会得到通知. 要概念上,它很接近事件.可以理解为,当DOM发生变 ...

  2. js类型转换

    1.js中有六种基本类型,分别是object.number.string.Boolean.null.undefined,其中number.string.Boolean为基本类型,有时使用会强制转换成对 ...

  3. SecutrCRTt 连接VirtualBox 中的Ubuntu -端口转发

    端口转发: 设置>网络>端口转发   端口转发: 子系统地址通过在Linux系统总使用ifconfig查看:   还需要在linux主机上安装sshd sudo apt-get insta ...

  4. Android面试题(一)

    1. 请描述一下Activity 生命周期. 答: 如下图所示.共有七个周期函数,按顺序分别是: onCreate(), onStart(), onRestart(), onResume(), onP ...

  5. UI-切圆角、透明度、取消按钮点击高亮效果、按钮文字带下划线

    一.切UIView的某个角为圆角 如果需要将UIView的4个角全部都为圆角,做法相当简单,只需设置其Layer的cornerRadius属性即可(项目需要使用QuartzCore框架).而若要指定某 ...

  6. android:使用Messenger进行进程间通信(一)

    Messenger简介 Messenger和AIDL是实现进程间通信(interprocess communication)的两种方式. 实际上,Messenger的实现其实是对AIDL的封装. Me ...

  7. 【译】Spring 4 基于TaskScheduler实现定时任务(注解)

    前言 译文链接:http://websystique.com/spring/spring-job-scheduling-with-scheduled-enablescheduling-annotati ...

  8. Python来做应用题及思路

    Python来做应用题及思路 最近找工作头疼没事就开始琢磨python解应用题应该可以,顺便还可以整理下思路当然下面的解法只是个人理解,也欢迎大佬们给意见或者指点更好的解决办法等于优化代码了嘛,也欢迎 ...

  9. linux 做gw(nat)详细配置

                          linux 做企业网关gw(nat)详细配置   最近因为公司的路由器老化导致上网时断时续,上半小时网就断一次网,为此我头疼不已,本着为公司节约成本的宗旨, ...

  10. CentOS7 安装Nginx

    由于需要,这段时间学一点“nginx”.关于nginx就不介绍了,http://wiki.nginx.org/Main有非常详细的介绍.安装等. 安装软件我习惯到官网下载源码,http://nginx ...