border-radius的兼容问题
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的兼容问题的更多相关文章
- uniapp自定义顶部搜索框兼容微信小程序
zhuanzai: uniapp自定义顶部搜索框兼容微信小程序 自定义组件 navbarvue (胶囊底部高度 - 状态栏的高度) + (胶囊顶部高度 - 状态栏内的高度) = 导航栏的高度 < ...
- 针对css3特性浏览器兼容 封装less
//--------------------------------------------------- // LESS Prefixer //--------------------------- ...
- 重温CSS:Border属性
边界是众所周知的,有什么新的东西吗?好吧,我敢打赌,在这篇文章中,有很多你不看永远不知道的东西! 不仅可以用CSS3来创建圆角,使用原有CSS一样可以显示自定义图形.这是正确的(有待考究):在过去,没 ...
- 为什么要使用sass
或许你已经听过一个叫作Sass的东东?可能你已经了解它,并且你能像大师一样写出一些函数? 对于不清楚我在讲什么的读者或者客户,你们可以想想web开发过程,你们的期望和站点用户的体验想要怎样的.无论如何 ...
- CSS3:线上编辑工具及实用资料整理
an I Use 个人最常用的,资料比较全,桌面和移动浏览器支持HTML5,CSS3,SVG和兼容性表. 官网地址:http://caniuse.com/ CSS3 Click Chart CSS3 ...
- CSS3 基本知识
1.CSS3 简介 CSS 指层叠样式表 (Cascading Style Sheets),用于控制网页的样式和布局,CSS3 是最新的 CSS 标准. 在网页制作时采用层叠样式表,可以有效的对页面的 ...
- 转:前端集锦:十款精心挑选的在线 CSS3 代码生成工具
今天这篇文章向大家推荐十款非常有用的在线 CSS3 代码生成工具,这些工具能够帮助你方便的生成 CSS3 特效.CSS3 是对 CSS 规范的改善和增强,增加了圆角.旋转.阴影.渐变和动画等众多强大的 ...
- compass模块
Compass核心模块Reset :重置CSS模块 @import "compass/reset" Layout :页面布局的控制能力 @import "compass/ ...
- css3前端工具
随着CSS3的出现,CSS3讨论的话题越来越多了,现在各种教程也是多如牛毛,不比一年前的时候,找个资料要捞遍整个互联网,而且还很难找到自己需要的参考资料.从侧面也说明,CSS3对于前端工程师来说,越来 ...
- css3工具
随着CSS3的出现,CSS3讨论的话题越来越多了,现在各种教程也是多如牛毛,不比一年前的时候,找个资料要捞遍整个互联网,而且还很难找到自己需要的参考资料.从侧面也说明,CSS3对于前端工程师来说,越来 ...
随机推荐
- Codeigniter 3.0 相关文档 part two
分页 首先,配置 $this->load->library('pagination'); $config = array(); // $this->config->load(' ...
- 汇编语言标记寄存器标记位_NV UP EI NG NZ AC PE CY
在8086CPU中,有一种标记寄存器,长度为16bit: 其中存储的信息被称为程序状态字(Program Status Word,PSW),以下将该寄存器简称为flag. 功能:1)用来存储相关指令的 ...
- nginx中相关配置
#nginx 开启目录浏览 location / { root /data/www/file //指定实际目录绝对路径: autoindex on; //开启目录浏览功能: autoindex_exa ...
- Shell 重定向
一直没搞懂 &> 和 <& 是表示什么意思. 今天自己总结一下,希望自己能理解它的真正含义. 重定向标准输入输出,切记 “1” 和 “>”之间没有空格 $ > ...
- Objective-C数据保存和读取
一.NSCoding协议中的Archiving和Unarchiving (1)Archiving一个object,会记录这个对象的所有的properties到filesystem: (2)Unarch ...
- Java中的夏令时问题
因为在用C#做项目的时候被夏令时坑过一回,所以这次将在java中的时区转换信息做一下记录,很简单 SimpleDateFormat inputFormat = new SimpleDateFormat ...
- RPM包管理命令rpm
RPM包管理器是Linux系统中最早的软件包管理软件之一,也是目前最流行的软件包管理器,许多发行版都使用RPM作为默认的软件包管理软件. RPM软件包名称格式: samba-client-3.0.33 ...
- 数据迁移工具sqoop
有问题........数据迁移工具sqoop sqoop安装 [root@sqoop data]# wget wget http://apache.fayea.com/sqoop/1.4.6/sqo ...
- margin属性
可以设置position:absolute/relative/fixed,通过调节top/bottom/left/right实现元素的定位,这样很好,但是有时候想通过margin来实现. 下面是mar ...
- GPS部标监控平台的架构设计(七)-压力测试
部标监控平台的压力测试是部标检测流程的最后一个检测环节,也是最难的,很多送检的企业平台都是卡壳在这一个环节.企业平台面临的问题如下: 1.对于压力测试的具体指标要求理解含糊,只知道是模拟一万辆车终端进 ...