jquery - 将扩展到屏幕外的 CSS 行

Question

我有一张图片，它的两端都有线条，如下所示:

我试图使线条无限，所以无论我缩小多少，线条看起来都像是从屏幕的末端发出的，而图像的大小没有变化。

我知道我可以使用 repeat-x 做一条白线，但我在尝试让超大 div 与屏幕重叠而不影响图像时遇到了问题。我正在使用 Bootstrap 。

这是我的图片代码

<div class="row">
               <div class="col-xl-12 hscentertext" style="">
                 <img src="assets/img/25k.png" class="img-fluid center-block text-xl-center" alt="Responsive image"> 
                <!--  <canvas id="canvas" class="fullonly" width="800" height="133" style="background-color:#D32225"></canvas> -->
               </div>
            </div>

有人可以帮助我实现这种效果吗？

Answer 1

您可以使用 110% 的宽度来实现这一点，如下所示:

img {
  position: absolute;
  width:110%
  overflow: hidden;
  }