【推荐】2019 Java 开发者跳槽指南.pdf(吐血整理) >>>

做文章详情页的时候经常会遇到一些图片本身带着宽度.这样手机浏览的时候很容易造成图片超出手机只显示一部分的问题.

jquery解决很简单

$('img').each(function(){
     $(this).css("width", '100%');
});

下面主要说一下php正则替换的问题

<?php
$content=$str = '<p>
	<img src="https://uimgproxy.suning.cn/uimg1/sop/commodity/iXiI9cWAMypF3784Cs4tGQ.jpg" style="width:641px;" /> 
</p>
<p>
	<img alt="" src="https://uimgproxy.suning.cn/uimg1/sop/commodity/Pgb8LxSjO_0DZs6_Bg9NsQ.jpg" style="width:641px;" /> 
</p>
<p>
	<img alt="" src="https://image.suning.cn/uimg/sop/commodity/345180125213456513569224_x.jpg" style="width:641px;" /><img alt="" src="https://image.suning.cn/uimg/sop/commodity/623465890103336458571025_x.jpg" style="width:641px;" /><img alt="" src="https://image.suning.cn/uimg/sop/commodity/112791020783637906390888_x.jpg" style="width:641px;" /><img alt="" src="https://image.suning.cn/uimg/sop/commodity/147335347212174233426570_x.jpg" style="width:641px;" /><img alt="" src="https://image.suning.cn/uimg/sop/commodity/202473008534901268381402_x.jpg" style="width:641px;" /><img alt="" src="https://image.suning.cn/uimg/sop/commodity/163259221916260638488252_x.jpg" style="width:641px;" /><img alt="" src="https://image.suning.cn/uimg/sop/commodity/581839910943954773447607_x.jpg" style="width:641px;" /><img alt="" src="https://image.suning.cn/uimg/sop/commodity/125712386592734187782483_x.jpg" style="width:641px;" /><img alt="" src="https://image.suning.cn/uimg/sop/commodity/388461868174485610126760_x.jpg" style="width:641px;" /> 
</p>';
echo preg_replace('#(<img.*?style=".*?)width:\d+px;([^"]*?.*?>)#i','$1width:100%;$2',$str);

echo preg_replace_callback('#(<img.*?style=".*?)width:\d+px;([^"]*?.*?>)#i', function($matches){return $matches[1].'width:100%;'.$matches[2];}, $str);
?>