简体   繁体   English

如何为移动网站制作响应式图像

[英]how to make Responsive image for mobile sites

I have a website which must be responsive for mobile phones. 我有一个必须响应手机的网站。 I've created it using my desktop. 我用我的桌面创建了它。 When I adjust browser windows it's working perfectly for mobile phone but when I check it on my real mobile phone: Microsoft- 640 it's not responsive to the mobile view.[Website working fine in all devices except Windows phone] 当我调整浏览器窗口时,它可以完美地用于手机但是当我在我的真实手机上检查时:Microsoft-640它对移动视图没有响应。[网站在除Windows手机之外的所有设备上都能正常工作]

Images in Bootstrap 3 can be made responsive-friendly via the addition of the .img-responsive class. 通过添加.img响应类,可以使Bootstrap 3中的图像响应友好。

Refer url: http://getbootstrap.com/css/#images 请参阅网址: http//getbootstrap.com/css/#images

I think that you may be missing in adding the meta viewport tag in the index.html . 我认为在index.html中添加meta viewport tag可能会遗漏。 The meta viewport is defined inside <head> tag like this : 元视口在<head>标记内定义,如下所示:

<head>
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>

For more information about meta viewport, you can read this article from w3school. 有关元视口的更多信息,您可以阅读w3school的这篇文章 Hope it helps 希望能帮助到你

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM