如果我知道我要用图像标签显示的图像的高度和宽度,我应该包括高度和宽度属性,还是只将信息放在CSS中？或两者？
防爆.
<img src="profilepic.jpg" height="64" width="64" />
要么
<img src="profilepic.jpg" height="64" width="64" style="height: 64px; width: 64px;" />
要么
<img src="profilepic.jpg" style="height: 64px; width: 64px;" />
代码可以在这里找到:
http://www.w3schools.com/css/tryit.asp?filename=trycss_float_elements
<!DOCTYPE html>
<html>
<head>
<style>
.thumbnail
{
float:left;
width:110px;
height:90px;
margin:5px;
}
</style>
</head>
<body>
<h3>Image Gallery</h3>
<p>Try resizing the window to see what happens when the images do not have enough room.</p>
<img class="thumbnail" src="klematis_small.jpg" width="107" height="90">
<img class="thumbnail" src="klematis2_small.jpg" width="107" height="80">
<img class="thumbnail" src="klematis3_small.jpg" width="116" height="90">
<img class="thumbnail" src="klematis4_small.jpg" width="120" height="90">
<img class="thumbnail" src="klematis_small.jpg" width="107" height="90">
<img class="thumbnail" src="klematis2_small.jpg" width="107" height="80">
<img class="thumbnail" src="klematis3_small.jpg" width="116" height="90">
<img class="thumbnail" src="klematis4_small.jpg" width="120" height="90">
</body>
</html>
我发现标签width:110px;内有 …
很久以前,当我第一次学习HTML时,我被告知必须始终在HTML中设置图像的尺寸,以便浏览器可以绘制一个空白框,图像应该放在哪里,渲染页面,以及然后下载并渲染它们所属的图像.如果您没有为图像设置宽度和高度值,则浏览器必须首先下载图像以发现它们的尺寸,并且对于具有糟糕连接的人来说,它会减慢页面加载速度.
在过去的几年里,我一直在使用CSS,我总是在我的HTML中的标签中width加上height声明img.我的问题是,在样式表中设置宽度和高度,不再添加这些HTML属性,同样好吗？如果没有它们,它确实使我的斯巴达HTML看起来更清晰.
我读过很多书，您应该将CSS样式与内容分开，并且使用内联样式不是最佳做法，但这与<img>标记的大小相同吗？
是使用属性设置宽度和高度的最佳实践，还是最好将其放入CSS类中？
<img src="myimg.png" height="100" width="200" />
要么
.myimg{
height:100px;
width:200px;
}
<img src="myimg.png" class="myimg" />
还是没有“最佳”实践？如果是这样，在哪种情况下应该使用1或2？
我被告知,为所有图像指定内联宽度和高度将有利于SEO,也有助于网站加载更快,如下所示:
<img src="http://www.example.com/images/free-size.jpg" width="200" height="400" alt="random image" />
虽然我仍然可以使用height:auto覆盖内联设置; .因此,在不同的显示平台上,图像可以正确地重新调整大小
但就在我继续这样做之前,只想确保这些陈述是否属实.就个人而言,我对使用外部CSS修复内联维度和覆盖感到怀疑,对我来说听起来有点哈哈......