Html CSS-使用选项卡实现边框图像

更像是一个后端程序员，但我正在实现一个设计，我只是想看看实现边框框最有效的方法是什么

下面是一个方框示例-

其想法是，蓝色选项卡将包含该节的标题文本

理想情况下，我只想使用HTML和CSS，但我意识到我可能需要使用标签作为图像，因为它的形状。根据内容的不同，这些框可以有多种尺寸

我可以用蓝色边框，不用担心

 -webkit-border-radius: 10px; -moz-border-radius: 10px;

或者类似的，主要是标签给我带来了问题。有没有人做过类似的事情来提供建议

.tab-header {
  background: blue;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  padding-bottom: 10px; /* we extend the header by 10px to the bottom */
}

.tab-body {
  border: 1px solid blue;
  background: white; /* set a solid background */
  margin-top: -10px; /* move the body 10px up, so it covers the
                        10px padding from above */
}

---

您必须相应地为边界半径的内容添加前缀，但除此之外，这应该适用于任何最近的浏览器。

并根据需要进行修改，应该适用于您所追求的内容。

您需要支持哪些浏览器？