HTML如何在两个div标签中间画一条竖线

要在两个div标签中间画一条竖线，可以通过以下步骤实现：

1.在HTML中的两个div标签之间插入一个空div元素作为竖线的容器。

2.使用CSS样式为这个空div元素添加宽度、高度、背景颜色以及边框宽度和样式等属性，来呈现出竖线的效果。

下面是两个示例来说明这个过程：

示例1: html和css代码

<div class="left"></div>
<div class="line"></div>
<div class="right"></div>

.left {
    width: 50%;
    float: left;
}

.line {
    width: 1px;
    height: 300px;
    background-color: #000;
    border: none;
    float: left;
}

.right {
    width: 50%;
    float: left;
}

在这个示例中，我们在两个div标签之间插入了一个空的div元素，class为"line"，并使用CSS为这个元素设置了1像素宽度、300像素高度的黑色竖线，并将它浮动到左边，使其在两个div中间。"left"和"right"分别设置了50%的宽度和浮动到左边，以充分利用页面空间。

示例2: html和css代码

<div class="container">
    <div class="left"></div>
    <div class="right"></div>
</div>

.container {
    width: 80%;
    margin: 0 auto;
    display: flex;
    align-items: stretch;
}

.left {
    flex-grow: 1;
}

.right {
    flex-grow: 1;
    border-left: 1px solid #000;
}

在这个示例中，我们在"container" div标签中使用flexbox布局，使其内部的“left” 和“right”两个div元素均匀排列、均匀分配剩余空间。对于“right”元素，我们使用CSS样式“border-left”添加了一条1像素宽度的实线边框来实现竖线的效果。

以上两个示例便是标准的攻略，你可以根据实际需求选择一种最适合你的方案。