【问题标题】:is it possible to size images for mobile on a simple HTML site?是否可以在简单的 HTML 网站上为移动设备调整图像大小?
【发布时间】:2014-02-23 17:49:47
【问题描述】:

我有一个非常基本的 HTML 网站,其中显示的图像使用以下代码:

<center><img src="style/images/istress.jpg" height="400" width="400" alt="photo by Kristin" class="attachment" /></center>

是否也可以针对移动设备优化图像?目前,当我通过 Safari 移动浏览器访问该网站时,它们会被拉伸/倾斜。不确定我是否能够仅使用 HTML 设置其他尺寸。

【问题讨论】:

  • 使用 CSS 代替 HTML 宽度属性 - img{max-width:400px;width:100%} -> JSFiddle
  • 您可能想阅读有关 CSS @media 查询的信息。这很有趣。

标签: html mobile-website image-size


【解决方案1】:

使用 GD 库提供多种尺寸,如果您想要果味,即使在飞行中也可以:)

有几种优化图像大小的方法,从动态调整大小到重度压缩,我将把这个留给你去研究,一些简单阅读的好链接是:

http://salman-w.blogspot.co.uk/2008/10/resize-images-using-phpgd-library.html

如果您的技术能力不强,您可以使用http://www.imgix.com/,我曾用过几次。也很靠谱。

【讨论】:

  • 感谢您的信息!我还没有涉足 PHP 或编程语言领域,但那篇文章非常有趣!
  • 编辑了我的答案以包含指向 imgix 的链接,这可能更符合您的要求。您可以将那里的系统用作您自己的模型,并且通过一些试验和错误并不难做到。
  • 看起来他们的 Retina Displays 选项是我正在寻找的 - 一个更便宜的选项会很好。感谢您的跟进!仍在浏览 CSS/PHP 信息页面
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2020-12-22
  • 2022-01-21
  • 2019-07-11
相关资源
最近更新 更多