响应式设计中的徽标不会调整大小以适应移动设备

Question

我有一个问题，我认为这是一个快速的解决方案...但是，我自己根本无法解决，通过搜索快速 运行 也没有帮助我。

基本上，我想解决的唯一真正问题是徽标（服务第一）没有缩小以适应移动表单中网站的宽度。虽然网站的其余部分对响应式网页设计的响应相当好（就像它通常得到的那样好），但 header 图像并没有抽搐那么多，这意味着它 运行s "off" 页面边缘。

我的网站位于 www.test.servicefirstsvc.com

如果您在移动设备上查看它，或者只是将您的网络浏览器 window 缩小到 phone 大小，您就会发现问题所在。有什么帮助吗？如果需要，我可以粘贴响应 CSS 的相关部分。

Answer 1

只需通过 CSS 给 img 标签一个 max-width: 100%;。

你也应该添加一个 height: auto; 因为 Safari 浏览器有一些奇怪的问题，没有注意图像的纵横比。