border-radius可以便捷的制作圆角效果,不需要通过增加圆角图片来达到效果,便于维护。

语法:border-radius:none | 1-4 length | % / 1-4 length|%

按顺序设置圆角四个方向的值,和设置border的顺序一样。

' / '前后的值都存在,那么' / '前面设置的值为水平半径,后面设置的值为垂直半径。若没有' / ',则水平和锤子半径相等。

border-radius的兼容性:
支持的浏览器有: IE9+ Firefox4+ Chrome Sarari 5+  Opera

对于老板的浏览器,需要加不同的前缀,如-moz-  -webkit-

在浏览器中写法为:
-moz-border-radius:

-webkit-border-radius:

对于IE,IE9及以下不支持border-radius

低版本的IE要制作圆角效果,可以在背景上进行设置。

目前有一个办法使低版本IE兼容border-radius效果:

.box{

border-radius:15px;

behavior:url(ie-css3.htc);

}

需要下载一个htc文件,也是通过JS写的一个文件。在使用时,需要把这个文件放到服务器目录中。

注:当border-radius的值小于或者等于border的值的时候,边框内部角不再是圆角效果。

border-radius的兼容问题的更多相关文章

  1. uniapp自定义顶部搜索框兼容微信小程序

    zhuanzai:  uniapp自定义顶部搜索框兼容微信小程序 自定义组件 navbarvue (胶囊底部高度 - 状态栏的高度) + (胶囊顶部高度 - 状态栏内的高度) = 导航栏的高度 < ...

  2. 针对css3特性浏览器兼容 封装less

    //--------------------------------------------------- // LESS Prefixer //--------------------------- ...

  3. 重温CSS:Border属性

    边界是众所周知的,有什么新的东西吗?好吧,我敢打赌,在这篇文章中,有很多你不看永远不知道的东西! 不仅可以用CSS3来创建圆角,使用原有CSS一样可以显示自定义图形.这是正确的(有待考究):在过去,没 ...

  4. 为什么要使用sass

    或许你已经听过一个叫作Sass的东东?可能你已经了解它,并且你能像大师一样写出一些函数? 对于不清楚我在讲什么的读者或者客户,你们可以想想web开发过程,你们的期望和站点用户的体验想要怎样的.无论如何 ...

  5. CSS3:线上编辑工具及实用资料整理

    an I Use 个人最常用的,资料比较全,桌面和移动浏览器支持HTML5,CSS3,SVG和兼容性表. 官网地址:http://caniuse.com/ CSS3 Click Chart CSS3 ...

  6. CSS3 基本知识

    1.CSS3 简介 CSS 指层叠样式表 (Cascading Style Sheets),用于控制网页的样式和布局,CSS3 是最新的 CSS 标准. 在网页制作时采用层叠样式表,可以有效的对页面的 ...

  7. 转:前端集锦:十款精心挑选的在线 CSS3 代码生成工具

    今天这篇文章向大家推荐十款非常有用的在线 CSS3 代码生成工具,这些工具能够帮助你方便的生成 CSS3 特效.CSS3 是对 CSS 规范的改善和增强,增加了圆角.旋转.阴影.渐变和动画等众多强大的 ...

  8. compass模块

    Compass核心模块Reset :重置CSS模块 @import "compass/reset" Layout :页面布局的控制能力 @import "compass/ ...

  9. css3前端工具

    随着CSS3的出现,CSS3讨论的话题越来越多了,现在各种教程也是多如牛毛,不比一年前的时候,找个资料要捞遍整个互联网,而且还很难找到自己需要的参考资料.从侧面也说明,CSS3对于前端工程师来说,越来 ...

  10. css3工具

    随着CSS3的出现,CSS3讨论的话题越来越多了,现在各种教程也是多如牛毛,不比一年前的时候,找个资料要捞遍整个互联网,而且还很难找到自己需要的参考资料.从侧面也说明,CSS3对于前端工程师来说,越来 ...

随机推荐

  1. web系统访问频率限制

    无论是spring mvc还是struts,都可以为controller或者aciton执行前,增加拦截器. 通过拦截器中的逻辑控制,可以实现访问频率的限制. 首先构造访问频率数据类 class Fr ...

  2. java 操作Excel表 创建 查看 修改

    需要用到jxl.jar包  修改有两种方法一种是jxl的  另一种需要apache.poi包 package excelChuLi; import java.io.File; import java. ...

  3. sqlite数据库相关总结

    1. sqlite是轻量型.关系型管理系统,是嵌入式的,占用资源低.可移植性强,比mySql处理速度快,现在主流的版本是sqlite3 2. sqlite中的数据类型有TEXT(字符串,采用UTF-8 ...

  4. vi(Visual Editor)常用的命令

    任何用户最常做的事要数创建和编辑文件,包括文档.报告和文字,vi(Visual Editor)是一个有效而相对简单的全荧幕编辑,使用vi,只要记著少量基本指令,就可以开始起步,再学习其他更复 杂的指令 ...

  5. WireShar使用笔记

    1.下载wiresharp  官网下载 2.安装 安装后直接支持中文 很人性化哦 注意:一定要安装WinPcap 不然无法使用 3.

  6. https://yq.aliyun.com/articles/65125?spm=5176.100240.searchblog.18.afqQoU

    https://yq.aliyun.com/articles/65125?spm=5176.100240.searchblog.18.afqQoU

  7. Linux 搭建NTP服务器

    NTP服务器[Network Time Protocol(NTP]是用来使计算机时间同步化的一种协议,NTP服务器可以对其它服务器做时间同步化,从而达到时间统一. 配置环境及要求: A. 假设10.8 ...

  8. JS中isPrototypeOf 和hasOwnProperty 的区别 ------- js使用in和hasOwnProperty获取对象属性的区别

    JS中isPrototypeOf 和hasOwnProperty 的区别 1.isPrototypeOf isPrototypeOf是用来判断指定对象object1是否存在于另一个对象object2的 ...

  9. Java多线程代码示例

    package algorithm; class Mythread extends Thread{ String name; public Mythread(String name){ this.na ...

  10. 关于dll的一点收获

    蒙贾神指点. 对于kernel32.dll这种系统dll, 每一个进程都会加载一份, 映射到自己的进程空间. 实际上物理内存上还是只有一份dll. 如果对进程自己的dll进行修改, 这时操作系统会触发 ...