css伪类元素画后竖线 |纯css登录框

.content::after{
content: "";
display: block;
width: 1px;
height: 100%;
background-color: #000;
position: absolute;
right: 0;
top: 0;
}

其中，::after是伪类元素的一种。通过定义content: ""使其有实际内容；display: block;将其转换为块级元素，以保证空间大小可以被定义；width: 1px;定义宽度为1px；height: 100%;使其高度与父元素高度一致，以达到画一条竖线的目的；background-color: #000;定义竖线的颜色为黑色；position: absolute;将其定位方式设置为相对于父元素的绝对定位，以保证与父元素的距离可以被定义；right: 0;将其右侧距离父元素为0，以使竖线靠在父元素右侧；top: 0;将其顶部距离父元素顶部为0，以使竖线在父元素内顶部对齐。

通过以上代码，大家可以轻松地实现在一个元素的后面插入一条竖线的效果，从而让网页样式更加丰富多彩。