css,canvas画三角形

CSS

HTML:

<div>
   <p>css绘制</p>
   <div class='box1'></div>
</div>

CSS:

.box1 {
          width: 0;
          height: 0;
          border-right: 70px solid transparent;
          border-left:70px solid transparent;
          border-bottom:100px solid black;      
       }

canvas

HTML:

<div>
    <p>css绘制</p>
    <div class='box1'></div>
</div>

JS：

var can = document.getElementById('box2');
var ctx = can.getContext("2d");
ctx.beginPath();
ctx.moveTo(250,50);
ctx.lineTo(200,200);
ctx.lineTo(300,300);
ctx.closePath();
ctx.fill();