HTML5豎線是一種在網頁中繪制豎線的方法，使用簡單且兼容性好。下面是一段使用HTML5豎線繪制一個紅色豎線的代碼：

<canvas id="myCanvas" width="5" height="200" style="border:1px solid #d3d3d3;"></canvas><script>var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
ctx.beginPath();
ctx.moveTo(0, 0);
ctx.lineTo(0, 200);
ctx.strokeStyle = "red";
ctx.lineWidth = 5;
ctx.stroke();
</script>

以上代碼中，我們首先創建一個寬度為5像素，高度為200像素的canvas元素，然后使用JavaScript獲取canvas元素的上下文，即ctx，并開啟一個繪制路徑的步驟。

使用moveTo方法將畫筆移動到x坐標為0，y坐標為0的位置，即左上角。使用lineTo方法將畫筆移動到x坐標為0，y坐標為200的位置，即canvas的底部。在這兩個點之間繪制一條紅色的線段，并設置線段的寬度為5像素。

如果我們想要在HTML文件中繪制多個豎線，只需要復制以上代碼，并改變canvas元素的id即可。如果想要調整豎線的顏色或者寬度，只需要修改ctx.strokeStyle和ctx.lineWidth的值即可。