用border-image实现QQ气泡聊天窗效果

先给上参考链接：
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属性：顾名思义，就是设置边框图片的，他有一个很重要的思想，就是“九宫格”，
盗个鑫哥的图。。