添加装饰的CSS行结束选择器

假设你有一篇很长的文章

并且，您希望在每次换行之前（例如，对于所有屏幕大小）相应地添加一些内容

代码笔在这里：

看起来像这样：

我想让它看起来像这样：

e、 g:在每行末尾相应地添加一个插入符号

HTML

---

下面是一个使用背景和背景的想法

p{
最大宽度：300px；
}
p>span{
背景：
线性梯度（#000，#000）
右下角/
8px 1px
不重复；
右边填充：10px；
-webkit盒装饰中断：克隆；
盒子装饰破裂：克隆；
}

Lorem ipsum Door sit amet，是一位杰出的领导者。Nunc purus lectus，非妊娠期的孕妇，ipsum的consequat。埃尼分子的名言。埃尼安·埃利芬德·马萨·努克，我是比班杜姆·奎斯。在洛雷姆。这是一个古老的节日，是一个奥古斯都的节杖

Lorem ipsum dolor sit amet，是一位杰出的献身者。Nunc purus lectus，非妊娠期的孕妇，ipsum的consequat。埃尼分子的名言。Aenean eleifend massa nunc，

CSS中没有“行结束选择器”这样的东西。你想要的不是真的可能——至少不是以动态/响应的方式。至于不太复杂的解决方案，我最多可以看到一个定位的背景图像结合

盒子装饰来模拟它。但是如果这不起作用，或者你需要插入真正的字符……那么我想它会变得更加复杂，可能需要用到JavaScript。
<span>
  long long text long long text text  long long text long long text text long long text long long text text long long text long long text text 
</span>

<br>
<br>
<br>
<br>

<span>
  long long text long long text text  long long text long long text text long long text long long text text long long text long long text text 
</span>

span{
  max-width: 350px;
  display: inline-block;
}

br + span{
  max-width: 500px;
}