如何隐藏一个CSS边界的一部分很好

Question

我正在为iPhone做一个web应用程序，我遇到了一些边界问题。 为了简化我对身体的背景图像，一个带有圆角的盒子，里面有一些元素和一个标题，这就是问题开始的地方，因为我希望我的标题位于我的盒子的顶部边框上，而没有边框它。

这里是一个截图： 我看不到任何解决方案来正确渲染它，你们有些人有任何猜测？ 它会非常赞赏

Answer 1

据我所知，它看起来像你应该使用fieldset元素（因为你是“分组”的形式元素结合在一起），这方便也期待你想要的方式：

<fieldset> 
    <legend>Promoter</legend> 
    <select> 
     <option>Choose a promoter</option> 
    </select> 
</fieldset> 

造型很简单。对齐legend文字，样式的fieldset边框采用CSS：

fieldset { 
    border: 1px solid black; 
    border-radius: 5px; 
} 
legend { 
    text-align: center; 
} 

对于一个活生生的例子，看到this jsFiddle demo。

Answer 2

不确定是否有简单的基于纯CSS的解决方案。

有些实现你想要的方法是让文字上浮动text shadow，使用与背景的一般颜色混合的颜色。您可以调整这些值，使边框（至少大部分）会在文本后面消失。这当然也会消除背景图像，用阴影的颜色代替它，但无论如何它看起来都很不错。 （为文本提供更牢固的背景也会更容易阅读）。