CSS3的边框(二)
来源:互联网 发布:js清除div内容 编辑:程序博客网 时间:2024/04/30 07:44
二、边框图片
边框图片border-image属性,是用来给元素边框添加背景图像,在某些时候,利用这个 border-image 可以轻松绘制一些比较复杂的小部件。border-image只是一个简写属性,,用于设置以下属性:
• border-image-source
• border-image-slice
• border-image-width
• border-image-outset
border-image-repeat
Internet Explorer 不支持 border-image 属性。
border-image 属性规定了用作边框的图片。为了实现浏览器的兼容,在使用border-image属性时写法通常如下:
div
{
-webkit-border-image:url(border.png) 30 30 round; /* Safari 5 */
-o-border-image:url(border.png) 30 30 round; /* Opera */
border-image:url(border.png) 30 30 round;
}
设置的图片将会被“切割”成九宫格形式,然后进行设置。如下图
“切割”完成后生成虚拟的9块图形,然后按对应位置设置背景,
其中四个角位置、形状保持不变,中心位置水平垂直两个方向平铺。如下图
0 0
- CSS3的边框(二)
- CSS3 (二) 边框
- CSS3的边框(一)
- CSS3的边框(三)
- CSS3的边框(四)
- CSS3的边框
- css3中边框的总结
- Css3中边框的处理
- CSS3 (边框 圆角 阴影)
- CSS3的内径剪切问题(背景边框是虚线)
- CSS3尝鲜(三):利用CSS3的新功能实现(椭)圆角边框和图片边框
- CSS3尝鲜(三):利用CSS3的新功能实现(椭)圆角边框和图片边框
- 利用CSS3的新功能实现(椭)圆角边框和图片边框 (圆角)
- (二)CSS3的选择器
- css3.0抢先看(二):border-color边框颜色的新用法,绝对酷
- CSS3 边框
- css3 边框
- css3边框
- git 新添加一个项目
- 天津理工大学复试
- 一个简单的linux的测试修改模板
- bootstrap tooltip.js解析
- Java基础之泛型
- CSS3的边框(二)
- 为什么说特征是机器学习系统的原材料?
- CocoaPods安装和使用教程
- 嵌入式Linux系统---ppp拨号,4G模块上网
- 连接远程服务器上的mysql会出现的问题和解决方式(账号设置等操作)
- android使用groovy环境配置及所遇问题
- C语言用数组实现贪吃蛇
- 文章标题
- mysql如何创建数据库、创建表