使用HTML CSS或JavaScript制作垂直线

Question

我注意到网站trippeo.com中的垂直线条，如果您向下滚动到“增加旅行者忠诚度......”的位置，然后在下方有一条垂直线。你会如何在网页设计中创建一条长线？你需要制作一个图像和绝对位置吗？还是有更好的方法使用HTML，CSS和/或JavaScript？

Answer 1

您可以通过两种方式完成：

1. 背景图像右对齐并在y轴上重复。

   .main-liner {background: url("bg.png") repeat-y right top transparent;}
   

2. <强>边界

   .main-liner {border-right: 2px solid #f00; margin-right: -2px;}
   

预览：



小提琴：http://jsfiddle.net/praveenscience/RU42F/