Вы можете использовать CSS-свойство border в элементе <span> в сочетании с другими CSS-свойствами, такими как display и height, для создания вертикальных линий в HTML.
В следующем примере будет создана вертикальная разделительная линия между двумя изображениями. Вы можете дополнительно увеличить высоту линии, просто увеличив значение свойства height.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Make a Vertical Line in HTML</title>
<style>
.vertical-line{
display: inline-block;
border-left: 1px solid #ccc;
margin: 0 10px;
height: 125px;
}
</style>
</head>
<body>
<img src="images/club.jpg" alt="Club Card">
<span class="vertical-line"></span>
<img src="images/spade.jpg" alt="Spade Card">
</body>
</html>
