绘制一个黄色边内部填充红色的五角星

这里提供两种方式绘制五角星：

方法一：使用HTML和CSS绘制五角星

HTML代码：

<div class="star"></div>

CSS代码：

.star {
    width: 0;
    height: 0;
    border-right: 50px solid transparent;
    border-bottom: 35px solid yellow;
    border-left: 50px solid transparent;
    position: relative;
    margin: 50px auto;
}
.star:before {
    content: "";
    width: 0;
    height: 0;
    border-right: 50px solid transparent;
    border-bottom: 35px solid red;
    border-left: 50px solid transparent;
    position: absolute;
    top: -22px;
    left: -50px;
    z-index: 1;
}
.star:after {
    content: "";
    width: 0;
    height: 0;
    border-top: 35px solid yellow;
    border-right: 50px solid transparent;
    border-left: 50px solid transparent;
    position: absolute;
    top: 13px;
    left: -50px;
}
.star:before,
.star:after {
    transform: rotate(35deg);
}

方法二：使用Canvas绘制五角星

HTML代码：

<canvas id="myCanvas" width="200" height="200"></canvas>

JavaScript代码：

var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
ctx.beginPath();
ctx.moveTo(100, 0);
ctx.lineTo(120, 70);
ctx.lineTo(190, 70);
ctx.lineTo(135, 115);
ctx.lineTo(160, 190);
ctx.lineTo(100, 145);
ctx.lineTo(40, 190);
ctx.lineTo(65, 115);
ctx.lineTo(10, 70);
ctx.lineTo(80, 70);
ctx.closePath();
ctx.fillStyle = "red";
ctx.fill();
ctx.lineWidth = 5;
ctx.strokeStyle = "yellow";
ctx.stroke();

以上两种方式都可以绘制出黄色边内部填充红色的五角星。其中方法一使用HTML和CSS，代码相对简单，但需要一定的CSS基础；方法二使用Canvas绘制，需要一定的JavaScript基础。