成都网站建设设计

将想法与焦点和您一起共享

css不规则边框的设置方法

这篇文章给大家分享的是有关css 不规则边框的设置方法的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。

在钟楼等地区,都构建了全面的区域性战略布局,加强发展的系统性、市场前瞻性、产品创新能力,以专注、极致的服务理念,为客户提供成都网站建设、网站制作 网站设计制作按需定制制作,公司网站建设,企业网站建设,高端网站设计,营销型网站建设,外贸营销网站建设,钟楼网站建设费用合理。

css不规则边框的设置方法:首先创建一个HTML示例文件;然后通过“border-image: url(border.png) 30 stretch;”属性设置不规则边框即可。css如何设置不规则边框?

在CSS中,可以通过border-image属性来设置不规则边框。border-image属性可以使用图像来设置边框的样式。

示例:








border-image 属性用于指定一个元素的边框图像。

在这里,图像平铺(重复),以填补该地区。

在这里,图像被拉伸以填补该地区

这是原始图片:

效果图:

border-image属性

语法

border-image: source slice width outset repeat|initial|inherit;

属性值:

border-image-source 用于指定要用于绘制边框的图像的位置

border-image-slice 图像边界向内偏移

border-image-width 图像边界的宽度

border-image-outset 用于指定在边框外部绘制 border-image-area 的量

border-image-repeat 用于设置图像边界是否应重复(repeat)、拉伸(stretch)或铺满(round)。

感谢各位的阅读!关于“css 不规则边框的设置方法”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识,如果觉得文章不错,可以把它分享出去让更多的人看到吧!


文章名称:css不规则边框的设置方法
网站链接:http://chengdu.cdxwcx.cn/article/jgihsd.html