我在圆形div中做了一些文体,文本在容器顶部碰到了.我已经能够控制几乎所有的内容,嵌套的div,设置为背景的图像等,并将它们全部剪辑成功,但这一次给了我严重的悲伤.
使用旧式图像边框或掩盖不是解决方案,因为我们拥有动态图形背景.我们需要一个实际剪辑文本的解决方案.
这在Firefox 3.x和旧版Chrome中最为明显
以下是要使用的示例代码:
div {
-moz-border-radius: 45px;
border-radius: 45px;
background-color: #ccc;
font-size: 100px;
color: #777;
line-height: 70%;
overflow: hidden;
width: 257px;
}
Run Code Online (Sandbox Code Playgroud)
jank:
请注意,它已在新的Chrome和FireFox 4中修复 - shui:
我们的大多数网站用户都是Firefox 3.6,所以也希望能够为他们提供优雅的解决方案.任何帮助赞赏!干杯