1、四个参数:

  border-radius: 值1 值2 值3 值4;顺序:从左开始,顺时针顺

 div{
width: 200px;
height: 100px;
background-color: blue;
margin: 50px;
border-radius: 10px 20px 30px 40px;
}

2、两个参数:

  border-radius: 值1 值2;  顺序:上左下右,上右下左

  

 div{
width: 200px;
height: 100px;
background-color: blue;
margin: 50px;
border-radius: 200px 200px 0 0;
}

3、半圆的形成

  border-radius: 200px 200px 0 0;向上的半圆 高度要减半

  

 div{
width: 200px;
height: 100px;
background-color: blue;
margin: 50px;
border-radius: 200px 200px 0 0;
}

  

注:border-radius: 0 0 200px 200px ;向下的半圆 高度要减半

    

  

border-radius__边框圆角的更多相关文章

  1. 使用css3来实现边框圆角效果

    经常看到别人的网站有个边框来修饰文字区域,类似圆角矩形把文字环绕起来,特别有感觉,于是就试着用图片边框来修饰,但是用图片过多会拉慢网页的加载速度,能不能使用css3来实现边框圆角效果呢?当然borde ...

  2. CSS3 02. 边框、边框圆角、边框阴影、边框图片、渐变、线性渐变、径向渐变、背景、过渡transition、2D转换

    边框圆角 border-radius 每个角可以设置两个值,x值.y值 border-top-left-radius:水平半径 垂直半径 border-radius:水平半径/垂直半径 border- ...

  3. 从零开始学 Web 之 CSS3(二)颜色模式,文字阴影,盒模型,边框圆角,边框阴影

    大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...

  4. css3(border-radius)边框圆角详解(转)

    css3(border-radius)边框圆角详解 (2014-05-19 16:16:29) 转载▼ 标签: divcss html it css3 分类: 网页技术 传统的圆角生成方案,必须使用多 ...

  5. SilverLight:布局(1) Border(边框)对象、Grid(网格)对象

    ylbtech-SilverLight-Layout:布局(1) Border(边框)对象.Grid(网格)对象 A, Border(边框)对象 B, Grid(网格)对象 C, Grid(网格)对象 ...

  6. css边框样式、边框配色、边框阴影、边框圆角、图片边框

     边框样式 点线式边框 破折线式边框 直线式边框 双线式边框 槽线式边框 脊线式边框 内嵌效果的边框 突起效果的边框 <div style="width: 300px; height: ...

  7. CSS3 -- 边框圆角

    文章后有彩蛋哦 <!DOCTYPE html> <html lang="en"> <head> <meta charset="U ...

  8. CSS3 border-radius边框圆角

    在CSS3中提供了对边框进行圆角设定的支持,可对边框1~4个角进行圆角样式设置. 目录 1. 介绍 2. value值的格式和类型 3. border-radius 1~4个参数说明 4. 在线示例 ...

  9. border 外边框

    语法: border:<line-width> || <line-style> || <color> <line-width> = <length ...

  10. css3实现边框圆角样式

      基本语法: border-radius: 5px; 兼容大多数浏览器: /*兼容Mozilla(Firefox, Flock等浏览器)*/ -moz-border-radius-topleft: ...

随机推荐

  1. 如何编写自定义hive UDF函数

    Hive可以允许用户编写自己定义的函数UDF,来在查询中使用.Hive中有3种UDF: UDF:操作单个数据行,产生单个数据行: UDAF:操作多个数据行,产生一个数据行. UDTF:操作一个数据行, ...

  2. silverlight generic.xaml 包含中文 编译错误的问题

    发现我在一个dll工程里面新建一个xaml文件起名成generic.xaml 如果这个xaml里面存在中文则会编译错误,发现这样建立的xaml使用的是gb2312编码 果断文件-另存为-编码另存为 u ...

  3. sqlserver批量删除表

    --批量删除表 ) DECLARE tmpCur CURSOR FOR SELECT name FROM sys.objects WHERE TYPE='U' AND name LIKE N'%_Qu ...

  4. 完美兼容js的jsfuck小测试

    无意间发现了一个可以完美兼容js语言的jsfuck语言,所以留一个备份 js转换jsfuck的工具 www.jsfuck.com 效果 代码(预警!!!有点长,不过是不是很有意思) <!DOCT ...

  5. eclipse tomcat jdk 版本引用

    今日遇到一个问题,因为比较难找,所以记录下来,方便日后查阅,也许也可以帮助同行. 一个Java project工程,使用了solr6.2,所以需要引用jdk8才可以正常使用. 代码编写好了,已经提交s ...

  6. 如何使用Flashfxp上传下载文件

    一.首先您本地电脑需要安装flashfxp软件,您可以通过百度搜索下载. 二.我们打开flashfxp,然后在右上角点击“会话”,再点击“快速连接”,如下图. 三.弹出“如下图”窗口.请输入FTP连接 ...

  7. Linux下安装方法总结(源码安装)

    很久之前安装过windows下以及Mac下的node,感觉还是很方便的,不成想今天安装Linux下的坑了老半天,特此记录. 首先去官网下载代码,这里一定要注意安装分两种,一种是Source Code源 ...

  8. Ace admin 如何实现类似于freamset加载页面

    如上标题所述,ace admin做后台页面的时候,可以实现类似于用freamset的功能,但是ace admin做的比freamset更好,他可以用异步加载的形式展示,而加载的页面的内容可以尽可能的少 ...

  9. xwork-2.1.2.jar与xwork-core-2.1.6.jar的区别是什么? 在线等待 先谢谢了

    两个包是一样,都是struts2的核心包.不过有时下在的struts2的jar包中只有xwordk-core-2.1.6.jar包.做项目的时候最好两个都导入.

  10. MATLAB入门学习(三)

    我们再来看看矩阵常用的函数,除了上一篇提到的inv还有以下常见命令: det 计算方阵行列式 eig 计算特征值 trace 计算矩阵的迹 norm 计算矩阵的范数或模 orth 正交化 poly 求 ...