html5，怎么使用九宫格拉伸图片不失真？

游戏中，有些背景可以固定4个角落，来拉伸图片，使背景不失真

到了前端，这个该怎么实现啊？

这是要拉伸的图片，拉伸到500*500px

下图是游戏中的九宫格原理

嗯zoom和scale可以试试