奇怪的 HTML5 切片图像边缘顶部和边缘底部问题

发布于 2024-12-25 00:31:55 字数 432 浏览 4 评论 0原文

比较 HTML4 和 HTML5,我在将切片图像放置到我的网站时遇到一个奇怪的问题。

请参阅以下示例页面:

正如您在 HTML5 版本中看到的,图像边距顶部和顶部边距中出现了不需要的边距。底部,并且无法通过 CSS 覆盖删除。如何使 HTML5 版本看起来与 HTML4 版本相同(在这个简单的情况下)?

ps 这两个文件的唯一区别是标头 DOCTYPE 声明。

Comparing HTML4 with HTML5, I encounter a strange problem when placing sliced images to my website.

See the example pages below:

As you can see in HTML5 version, an unwanted margin appears in image margin top & bottom, and cannot be removed via CSS overrides. How to make HTML5 version look identical to HTML4 version (in this simple case)?

p.s. the only difference of the 2 files is the header DOCTYPE declaration.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

何时共饮酒 2025-01-01 00:31:55

img {vertical-align: Bottom;} 添加到您的 CSS 中。

Add img {vertical-align: bottom;} to your CSS.

醉梦枕江山 2025-01-01 00:31:55

尝试删除高度和距桌子的宽度IMG

Try removing Height & Width from Table & IMGs

习惯成性 2025-01-01 00:31:55

添加 img { 显示:块; } 到你的CSS。 HTML5 会导致浏览器渲染内联内容与 HTML4 略有不同。

有关更多信息,请参阅 Mozilla 的这篇信息文章:https://developer.mozilla.org/ en/Images%2C_Tables%2C_and_Mysterious_Gaps

Add img { display: block; } to your css. HTML5 will cause browsers to render inline stuff slightly differently to HTML4.

For more information, see this informative article from Mozilla: https://developer.mozilla.org/en/Images%2C_Tables%2C_and_Mysterious_Gaps

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文