html - 在 p-tag 中填充以实现半透明图像叠加

Question

我有一个需要覆盖需要填充的文本块的img内部。div

外部 div 标记具有溢出：隐藏，因为需要将图像裁剪到最大高度。

如果你看看我的小提琴

http://jsfiddle.net/Py49n/1/

您会看到 p-tag 内的文本被写入最右侧，因为 p-tag 的宽度为 100% + padding。

如何在不使 p-tag 变宽的情况下获得文本的边距？

谢谢你的帮助

Answer 1

使用box-sizing: border-box（和适当的前缀）允许调整框的大小以包含填充。有关CSS 技巧的更多信息。浏览器支持还不错。如果您需要支持 IE7，您将需要另一个解决方案，也许是 polyfill。