图像总是在 wordpress 网页上加载模糊，并且在 Safari 上不加载答案

【问题标题】：Image always loads blurry on wordpress webpage and doesn't load on Safari图像总是在 wordpress 网页上加载模糊，并且在 Safari 上不加载
【发布时间】：2014-01-06 09:21:54
【问题描述】：

我一直在为我父亲的咖啡馆制作网站（CMS：Wordpress）' - www.barcaffecitta.it，但我无法让图像清晰且不模糊，并且适用于所有浏览器。该图像以 7320 × 5484 分辨率 (64 MB) 的 TIFF 开始，我最初将其调整为具有 2000 x 1498 分辨率的 TIFF 并设置 html 宽度：100% 和高度：90%，这使它在 safari 中工作得很好，但是我发现其他浏览器不自动支持 TIFF。因此，我尝试将其转换为 PNG 和 JPEG，但每次图像变得模糊或根本无法加载到 Safari 中。如果您现在查看该网站，则有一个分辨率为 960 x 619 的 JPEG，其 html 高度和宽度以 px 为单位精确设置为分辨率。如果您可以建议从原始 TIFF 开始的路线或图像的习惯做法，请告诉我。另外，上传图片时 HTML 的高度和宽度应该是多少像素，如果使用不同的显示器，我选择的任何内容都会自动调整大小？！

谢谢！

【问题讨论】：

你的 jpg 是 300x193，你显示它就像是 960x619。当然看起来很模糊
如果我在 wordpress 中查看我的媒体，图片实际上就是我所说的那样。（尺寸：960 × 619）300x193 是 wordpress 自动将其插入页面的尺寸，但可以通过编辑标记中的 html 宽度和高度来更改。

标签： html wordpress image cross-browser resolution

【解决方案1】：

<img src="http://www.barcaffecitta.it/wp-content/uploads/2013/12/Caffè-Città-JPEG-cropped960x619-300x193.jpg" width="900px" height="619px" class="alignnone size-medium wp-image-90" />

è 图片网址中的字母
图片网址中的字母
width="900px"
height="619px"

这些是图像模糊甚至无法在某些浏览器上加载的原因。应该是这样的：（但是重新上传图片名称为“Caffe-Citta.jpg”）

<img style="width:960px;" alt="Caffè-Città" src="http://www.barcaffecitta.it/wp-content/uploads/2013/12/Caffe-Citta.jpg" class="alignnone size-medium wp-image-90" />

【讨论】：

感谢您的帮助，但我复制并粘贴了您提供的代码，Safari 仍然无法加载图像，并且在蓝色框中有一个小问号，mozilla 现在根本无法加载。如果您有任何其他建议，我将不胜感激。当我插入图像时，我是通过 wordpress 上的添加媒体按钮而不是手动进行的，因此语法是自动化的并且应该是正确的。我所做的只是调整高度和宽度值。还有另一个一般的经验法则，如果我想在我的网站中插入图像，你会对我的起始 TIFF 做什么？
调整 TIFF 大小，转换为 90% 质量的 jpeg 并以正确的名称保存。除非您以正确的名称重新上传 jpg 图像，否则我的代码将不起作用。（不带 è à 字母）