微信气泡的图片铺满怎么做的？canvas做出来吗？css呢

提供一个兼容性不高的方法，效果还行，利用css3的clip-path属性和border-radius属性。
代码地址：看这里点击预览，其中图片右上端和右下的圆角和左上左下的圆角的半径不一样，是因为被剪切掉了，所以要加大半径来模拟效果。

分割线，不过有个思路，可以用js控制切割的路径，比如说向右边的圆角，那是四分之一弧，可以模拟100个或者更多个点，他们之间的连线就可以大概模拟出一个四分之一弧了。要计算大量的坐标，题主可以试试，我还在试

---------- 好了，更新----------------------------------------------
看效果：点这里点击预览
代码主要就是生成polygon函数的参数，polygon是多边形，其中我给那个小三角的位置固定了，没有整成参数。
左上和左下的圆角是用的border-radius生成的，右上角和右下角的是绘制路径剪切而成

/**
 @r {number}  圆角的宽度 
 @x {number}  图片的宽度 
 @y {number}  图片的高度
*/
function makeTopPointPos(r,x,y){
  var angle,rx,ry,a,b,item;var arr=[];
  for(var i=0;i<2000;i++){
      angle=i/1000*Math.PI/2;
      rx=0.95*x-r+r*Math.cos(angle);
      ry=r-r*Math.sin(angle);
      a=rx/x*100+'%';
      b=ry/y*100+'%';
      item=a+' '+b;
      arr.push(item);
  }
  return arr;
}
function makeBottomPointPos(r,x,y){
    var angle,rx,ry,a,b,item;var arr=[];
   for(var i=0;i<2000;i++){
      angle=i/1000*Math.PI/2;
      rx=0.95*x-r+r*Math.sin(angle);
      ry=y-r+r*Math.cos(angle);
      a=rx/x*100+'%';
      b=ry/y*100+'%';
      item=a+' '+b;
      arr.push(item);
   }
   return arr;
}
var topPoints=makeTopPointPos(20,200,200).join(',');
var bottomPoints=makeBottomPointPos(20,200,200).join(',');
function makeParams(r,x,y){
    var rtx=(0.95*x-r)/x*100+'%';
    var rty=r/y*100+'%';
    var rbx=(0.95*x-r)/x*100+'%';
    var rby=(y-r)/y*100+'%';
    var html='(0% 0%,0% 100%,'+rtx+' 100%,'+bottomPoints+', 95% '+rby+',95% 35%,100% 32%,95% 29%,95% '+rty+','+topPoints+','+rtx+' 0%)';
    return html;
}