在html或css中指定图像大小的区别

时间:2014-07-14 21:51:17

标签: html css image

This link非常接近我的问题,但似乎适用于语法而不是实际渲染输出:

我看到图像的高度和宽度可以在实际的html img标记中定义,事实上我读它的方式应该在那里定义。但是,我想知道图像显示的重要性。如果我插入以下代码

<img src="images/academia_vs_business.png" width="740" height="382" alt="" />

没有应用于图像的css,是否会以原始宽度和高度进行渲染?

如果我执行为该图片添加css样式,例如

img {
    width: 400px
}

它是否会否决html的width属性?

如果我没有在html中指定图像的高度和宽度,那么唯一的问题是我没有将实际图像大小传达给非可视用户代理或者是否存在其他问题(例如浏览器可以在页面加载期间为imgs分配空间。

如果css要改变图像大小,那么html标签中的大小是不是多余了?

我想这一切都可以归结为放置和放大图片的最佳做法,我很乐意听到别人的技巧。

1 个答案:

答案 0 :(得分:4)

来自the W3C website

  

UA可以选择在HTML源文档中表示表示属性。如果是这样,这些属性将被转换为具有等于0的特定CSS规则,并被视为在作者样式表的开头插入它们。因此,它们可能会被后续的样式表规则所覆盖。在过渡阶段,此策略将使样式属性更容易与样式表共存。

有关详细信息,请参阅this answerthis question