入门 硬件知识 电脑基础 上网入门 故障 电脑修护 电脑健康 精通电脑 网站 DIV+CSS 建站知识 SEO知识
教程 电脑操作 平面设计 路由设置 技巧 Word Excel QQ技巧 壁纸 自然风景 酷车美女 系统桌面
系统 安装系统 系统技巧 系统设置 安全 木马查杀 黑客防御 安全资讯 美女 明星写真 清纯美女 性感美女

主页 > 网站建设 > DIV+CSS技巧 > INTRODUCE

CSS3 HTML5实例二(图形化边界)

发布时间:2013-11-25 作者:电脑知识网 来源:www.sogoupc.com 字号:

  \

  顾名思义,图形化边界就是允许使用图片作为对象的边界,语法如下:

  border: 5px solid #cccccc;

  -webkit-border-image: url(/images/border-image.png) 5 repeat;

  -moz-border-image: url(/images/border-image.png) 5 repeat;

  border-image: url(/images/border-image.png) 5 repeat;

  这里,border: 5px 设定了边界的宽度,然后,每个边界的图片定义告诉浏览器,使用图片的多大一部分来充当边界。边界图片还可以针对每一条边单独设置:

  border-bottom-rightright-image

  border-bottom-image

  border-bottom-left-image

  border-left-image

  border-top-left-image

  border-top-image

  border-top-rightright-image

  border-right-image

  支持的浏览器: Firefox 3.1, Safari , Chrome.


文章: CSS3 HTML5实例二(图形化边界)
地址:http://www.sogoupc.com/web/201311/8944.html
------分隔线----------------------------
------分隔线----------------------------
热门DIV+CSS技巧文章推荐