css - 理解 HTML5 中的图像处理

标签 css html

我是 HTML5 的新手,我想了解在 HTML5 中处理图像的概念 看这个http://mavintophospital.com/test/test.html

示例 1:我没有在图像之间添加任何边距或填充,但默认情况下浏览器会在图像之间添加 5px 的空间/间隙

示例2:图片本身的宽度太高,所以将一张放在另一张下面对齐,但这里浏览器没有添加任何空间。

为什么会这样?

这就是我想要实现的目标:http://mavintophospital.com/test/test1.html
在这里,我通过给它 width: 100% 使图像流畅。 但是一个5px空间/间隙由浏览器在图像底部添加到其容器中。

我想删除它。

我试过给它绝对定位,但它搞砸了。

这一切只有在我使用 <!DOCTYPE html> 时才会发生- HTML5 文档类型

最佳答案

您的第一个问题由空格回答。 改变

<img alt="Some thing about Coral JQM" src="test_files/red0.png">
<img alt="Some thing about Coral JQM" src="test_files/red0.png">
<img alt="Some thing about Coral JQM" src="test_files/red0.png">

单行

<img alt="Some thing about Coral JQM" src="test_files/red0.png"><img alt="Some thing about Coral JQM" src="test_files/red0.png"><img alt="Some thing about Coral JQM" src="test_files/red0.png">

对于你的第二个问题,将垂直对齐样式设置为顶部。

<div style="background: #ff0">
    <img style="width: 100%; vertical-align:top;" alt="Some thing about Coral JQM" src="test1_files/red.png">
</div>

关于css - 理解 HTML5 中的图像处理,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19322899/

相关文章:

javascript - 将导航与 Logo 对齐

php - CSS/PHP - 为每个 PHP 字符串使用不同的 CSS

javascript - 如何在openui5中调用/重新渲染按钮

php - mysql_affected_rows 不显示消息

CSS - 页面不会滚动

CSS - 打印 : repeat background through all the page

css - 有哪些可用的 CSS 调试工具?

jquery - 如何在 html/css 中使用 sprite 图像并使用 jQuery 切换更改

javascript - 为什么 .click 事件处理程序未在此处更新?

javascript - 保护 SPA HTML5 应用程序和 Web 服务之间的用户 token ?