请在Chrome、Firefox、猎豹、360等现代浏览器浏览本站。另外提供付费解决seo优化、企业网站、网络推广、百度排名、网站修改等问题,如果需要请 点击 加我 QQ 说你的需求。

图片在手机上无法自适应显示该怎么办

企业建站 智迅seo优化

【导语】 前几天,智迅建站博客的一位同行朋友和我说,他帮客户建了一个网站,但是网站上的图片在手机端无法自适应,看起来非常不美观,叫小编帮帮忙解决一下。小编仔细浏览了该网站的图片显示问题,并看了页面代码,经过分析应该是CSS样式设置的问题导致的

【导语】

前几天,智迅建站博客的一位同行朋友和我说,他帮客户建了一个网站,但是网站上的图片在手机端无法自适应,看起来非常不美观,叫小编帮帮忙解决一下。小编仔细浏览了该网站的图片显示问题,并看了页面代码,经过分析应该是CSS样式设置的问题导致的,于是经过对网站图片的CSS样式进行了调整,调整后,发现问题解决了。下面小编和大家分享一下图片在手机上无法自适应显示的解决方法:

 

第一步:找到控制图片的CSS文件

找到控制网站图片的CSS文件,CSS文件的路径我们可以通过该网页模板的代码可以找到,然后点击进入放置CSS文件夹,然后用Dreamweaver打开相应的css文件。

第二步:找到控制图片的CSS标签

打开含有图片的网页,然后查看源代码,并找到图片的css标签,注意,这里我们要找的是控制图片的全局性css标签,而不是局部控制标签。

第三步:修改控制图片的CSS标签

一般来说,控制图片的css标签都会采用img来命名,所以我们在img标签中加入,width: 100%;的控制语句这样就可以通过全局的方式控制所有图片都以100%宽度在手机中显示。但是这样也有一个问题,如果有些图片我们不需要100%显示怎么办?没关系,我们可以通过局部标签来控制某个图片的显示尺寸,比如我们有些图片是按自带宽高度显示的话,那么我们就可以通过外部标签建立局部控制width: 100% !important; height:auto !important;就可通过优先级来实现不同的显示方式了。

【结语】

以上就是智迅建站为大家提供的关于图片在手机上无法自适应显示的解决方法,希望该方法可以帮到大家。大家如果还有什么问题的话,可以随时微信联系小编,咱们可以一起探讨解决方法。

分享到
  • 微信好友
  • QQ好友
  • QQ空间
  • 腾讯微博
  • 新浪微博
  • 人人网