Javascript 如何剪切文本右下角的背景色

我在剪切文本右下角的背景色时遇到问题。有人能帮我吗？我设法用Javascript实现了这一点，但由于每个单词都存在跨度问题，我的老板没有接受我的解决方案，所以我希望有人能够在没有Javascript的css中提供帮助，或者如果Javascript需要针对id而不是跨度，因为在sitecore中，他们决定是否选择h1、h2、h3等等。 链接如下：

#大标题，
#小标题{
显示：内联；
-webkit盒方向：水平；
-webkit盒方向：正常；
-ms柔性方向：行；
弯曲方向：行；
浮动：左；
}
#大标题{
-webkit填充端：5%；
-moz填充端：5%；
填充直列端：5%；
字体大小：46px；
线高：58px；
填充：0 15px；
浮动：左；
字号：200；
保证金：0；
文本转换：大写；
颜色：#fff；
宽度：630px；
背景色：rgba（0,0,0,7）；
字体系列：Roboto；
字号：200；
}
#小标题{
填充：0 15px；
保证金：0；
背景色：rgba（0,0,0,7）；
字体系列：Roboto；
字体大小：22px；
线高：33px；
颜色：#fff；
文本转换：大写；
字体系列：Roboto；
字号：200；
}

JS-Bin
标题1


从前在西方和东方


如果你在网上预订，可以省下100克朗。

这不是一个简单的问题，因为您应该开发一个解析器，以正确的方式使用

剪切字符串（不剪切单词，或将

放在逗号/点/任何符号之前）。您应该获得父容器.c-imagebox-headlines-tm-35的宽度，然后根据h1的字体大小计算最大字数，并对字数和字体大小进行最佳近似。 对于一个愚蠢的问题来说，这是一个很难解决的问题

---

也许您可以尝试使用此线程

发布的问题似乎根本不包含解决问题的内容。StackOverflow希望您首先解决自己的问题，因为您的尝试有助于我们更好地了解您的需求。请编辑问题以显示您尝试过的内容，以便说明您在中遇到的特定问题。您不太可能真正想要剪辑路径或类似的内容。更可能的情况是，您只是想使包含此特定文本的元素成为内联元素，以便其轮廓跟随文本，而不是整个元素创建块。Hi@ankit，我尝试了使用Javascript的解决方案，但我的老板没有接受这个想法，因为每个单词都有一个跨度，这里是链接@misorude，我尝试了剪辑路径，但它从上到下切割黑色，我只需要从东到下切割右下角，与红色相同above@misorude这是链接，在我的第三个解决方案中，我删除了javascript，我试图找出如何剪辑背景。如果您能帮助我，我将非常感激。谢谢你的链接，是的，我同意这不是一个简单的问题，因为我已经为此花费了很多时间