如何在完整的 wordPress 页面上添加垂直线？

Question

我在 wordpress 上使用 Flatsome 主题，需要在一个完整的主页上在三个侧面（左中右）绘制垂直线。您可以将其视为在页面上实现垂直线的参考站点 (https://pelicula.qodeinteractive.com/)。这些垂直线是从头到尾实现的，我的设计中需要相同的。

有没有什么插件可以提供帮助？ 我应该考虑什么方法？ 任何建议将不胜感激

(https://pelicula.qodeinteractive.com/)

Answer 1

您可以使用简单的 htmtl 元素和 css 来做到这一点。 只需在您的子主题的主要网站文件（或更好的 header.php）中添加三个 div（更多信息：https://developer.wordpress.org/themes/basics/template-hierarchy/） 然后对其应用以下 css。

body {
  height: 3000px;
}

div {
  height: 100vh;
  width: 1px;
  position: fixed;
}

#one {
  background: blue;
  left: 20%;
}

#two {
  background: green;
  left: 50%;
}

#three {
  background: orange;
  right: 20%;
}

<div id="one"></div>
<div id="two"></div>
<div id="three"></div>