HTML5画布是一项通用技术，它允许我们使用JavaScript在画布上实时绘制2D图形。其中一个最基础的2D图形就是线。本文将介绍如何在HTML5画布上使用JavaScript绘制线条，并对每个绘制步骤进行说明。

首先，我们需要在HTML文件中添加一个标签，这是HTML5画布的主要元素。该标签有两个属性，width和height，分别控制画布的宽度和高度。在这个例子中，我们将宽度和高度都设置为500。

接下来，创建一个JavaScript变量canvas，指向标签。通过getContext()方法创建一个绘画环境，我们将在该环境中绘制线。该方法需要传递一个参数来指定绘制环境的类型。在这个例子中，我们将使用2D图形环境，因此参数应设为"2d"。

为了在画布上绘制线条，我们需要指定线条的起始点和结束点。可以使用moveTo()方法来指定起始点。在这个例子中，我们将线的起始点设置在(100, 100)处。接下来使用lineTo()方法指定线条的结束点。我们将结束点设置在(400, 400)处。这创建了一个从(100, 100)到(400, 400)的线。最后，使用stroke()方法将线条添加到画布中。

可以使用strokeStyle属性更改线条的颜色。在这个例子中，让我们将线条的颜色设置为蓝色。我们还可以使用lineWidth属性来更改线条的宽度。在这个例子中，让我们将线条宽度设置为5。

我们可以使用上述步骤绘制任意数量的线。例如，可以绘制两条互相交叉的线。使用moveTo()指定第一个线条起始点，并通过lineTo()方法指定第一个线条结束点，并使用stroke()方法将线添加到画布中。然后，使用moveTo()方法指定第二个线条的起始点，并通过lineTo()方法指定第二个线条的结束点，在使用stroke()方法将第二个线条添加到画布中。

HTML5画布是一项功能强大的技术，可用于创建各种机制的2D图形。在这个例子中，我们演示了如何在画布上使用JavaScript绘制线条。可以尝试更改线条颜色和宽度，以及添加更多的线条来创建其他形状。