手机打开网页后图片被拉长怎么处理

1、最简单最笨的方法是把图片的高度属性调整为自动。首先，我们通过PC打开网页，右键点击图片，选择“审查元素”，查看图片的高度宽度属性，图片的高度宽度都被定义了，这是图片显示被拉长的根本原因。

2、修改图片的源代码，只要把“height: ***px;”修改为“height: auto;”即可。这是最简单最笨的方法，因为这代表着所有的图片都要这样修改一遍才能使全部图片达到自适应的目的，如果图片库庞大，那么用这种方法显然是不行的。

1、现在介绍第二种方法，这种方法可以一次性将所有的图片都修改为自适应效果，即修改css属性，对于小白来说还是稍微有一点难度的。同样的右键点击图片，选择“查看网页源代码”，找到定义css的文件。

2、修改css文件的img定义，在css文件中添加代码“.img{max-width: 100%;height: auto;width: auto\9;}”，注意这里的img指向整个网站中大部分的图片，也就是说大部分图片都会有自适应效果。如果只想将某一特定位置的图片改为自适应，那么就要定义为特别的属性，比如说article_img,同时发表位置的img也要进行更改。

3、修改完成后必须要更新网站（不是刷新哦），完成后通过手机进行查看，最终效果如下。