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对于前端工程师来说,越来 ...
随机推荐
- Android开发使用TotalControl调试遇到的问题(备注)
背景:Android开发,使用TotalControl控制手机进行调试. 过程:Eclipse调试一直正常,某天下午突然提示:无法启动ADB.exe,请确认是否在对应的路径下. 怀疑是自己程序写的有问 ...
- WebApp中的页面生命周期及路由管理
最近切换到一个新项目,使用的技术栈是Require+Backbone,鉴于对鞋厂webapp框架的了解,发现这个新项目有些缺陷,主要是单纯依赖Backbone造成的,也就是Backbone的好和坏都在 ...
- poj1753
#include <stdio.h> char s[100][100]; int s1[100][100]; int ax[5]={0,-1,0,1,0}; int ay[5]={0,0, ...
- 带你玩转JavaWeb开发之四 -如何用JS做登录注册页面校验
今日内容 使用JQuery完成页面定时弹出广告 使用JQuery完成表格的隔行换色 使用JQuery完成复选框的全选效果 使用JQuery完成省市联动效果 使用JQuery完成下列列表左右选择 使用J ...
- lnmp配置Yii2规则
nginx配置: 参考地址:http://www.cnblogs.com/grimm/p/5389970.html location / { try_files $uri $uri/ /index.p ...
- node静态资源管理变迁之路
使用express自带的,express.static,如:app.use(express.static('hehe')),就可以用localhost/hua.png,访问项目根目录下,hehe文件夹 ...
- cloudera learning2:HDFS
存入HDFS的文件会按块(block)划分,默认每块128MB.默认1个block还有2个备份.备份增加了数据的可靠性和提高计算效率(数据本地化). HDFS部署可选择不支持HA,也可选择支持HA. ...
- linux下文件搜索命令学习笔记
1. locate:按照文件名搜索文件 locate filename 与find在整个操作系统中遍历搜索不同,locate命令在/var/lib/mlocate这个后台数据库中按照文件名搜索,所以优 ...
- 如何添加Tomcat为启动服务
tomcat8.0, 可以用startup.bat启动, 但注销又不能启动服务,但现在的系统不知出了什么问题 ? 答 1.我这个是zip版本的,所以里面有一个service.bat的文件,所以很简单 ...
- LL基本姿势
在说怎么练习之前,先说说LL这个游戏里面的一些基本概念: 谱面元素(element) 谱面由一个个的音符组成,在LL中,音符(Note)分以下三类: 单点(下简称S,Single),同一时刻只有一个圆 ...