先给上参考链接:
http://www.zhangxinxu.com/wordpress/2010/01/css3-border-image%E8%AF%A6%E8%A7%A3%E3%80%81%E5%BA%94%E7%94%A8%E5%8F%8Ajquery%E6%8F%92%E4%BB%B6/
先看一张效果图:
素材图片:
我们不妨想想素材图片是经过怎样的变换变成了最终的效果图?
就好像是素材图片被“拉长”、“拉高”了一样,是吧?
那有没有没有被“拉伸”过的元素呢?就是四个角上的元素,比如:眼睛和三角框,整个图片被拉长,被拉高,但是他们依旧稳如泰山,不改本色,只是四个角之间链接的线被拉长了,看懂了这些就可以继续往下看了。
先简要介绍一下border-image属性:顾名思义,就是设置边框图片的,他有一个很重要的思想,就是“九宫格”,
盗个鑫哥的图。。