如何在 CSS 中为复杂形状添加圆角答案

【问题标题】：How do I add rounded corners to complex shapes in CSS如何在 CSS 中为复杂形状添加圆角
【发布时间】：2020-05-11 06:03:16
【问题描述】：

如何在 CSS 中使复杂形状的角变圆？类似于 VSCode 如何对所选代码进行圆角处理。我知道如何在 CSS 中制作一个圆形的常规矩形，但是如果矩形接触或相交，我如何加入圆角？如有必要，为此使用 JavaScript 也可以（只是不要使用画布或类似的东西）。下面是一个 VSCode 的例子：

我对此进行了研究，只发现了很多矩形的解决方案，但对非凸形甚至非矩形形状一无所知。

【问题讨论】：

希望您至少尝试自己编写代码。我建议你做一些additional research，无论是通过谷歌还是通过搜索，尝试一下。如果您仍然遇到问题，请返回您的代码并解释您尝试过的操作。
我已经对此进行了研究，但没有发现任何有用的东西。也许我应该解释一下，以免受到处罚？
您可能想解释一下“复杂形状”的含义。 SVG？在画布上绘制的形状？什么是“复杂形状”？
嗯，复杂的形状与突出显示的文本并不完全相同。如果您进行了您声称的研究，您会看到关于突出显示的文本：stackoverflow.com/questions/24985529/…

【解决方案1】：

正如评论中所指出的，How to apply rounded borders to highlight/selection 专门针对突出显示的文本回答了问题。对于其他复杂的形状（如字面意思，任何其他形状），我只需要确定使用画布或 SVG，尽管这并不是真正的目标。

【讨论】：