推荐搜索: 魏义齐 网站防扒js微信号刷新 利用hbuilder打包APP的步骤清空

您当前的位置:首页 > 前端分享 > 正文

phpcms文章内容页的图片如何自适应

发布时间:2017-12-04 12:12:18作者:魏义齐阅读:(

关于phpcms文章内容页的图片如何自适应的问题从我学会phpcms开始一直困扰我到现在,以前是没找到方法,这次能解决也是必然加偶然。

必然性在于自适应网站对内容页的要求,这促使我必须解决这个问题;偶然性在于以前也在网上找过方法,但没有解决问题,这次是偶然冒试解决了问题。也是这个问题直接导致了我的博客把pc站和移动站分开做了。

实现方法:

第一步:把原来文章页的{$content}替换成{php echo preg_replace("/style=\".*?\"/i","class=\"carousel-inner img-responsive img-rounded center-block\"",$content);}。更新缓存,生成首页,点开内容页,右键查看源代码,如下图:





图片多出了一个类名,未替换之前是没有这个类的。

第二步:让图片集中,这个方法很简单,给图片display:block,让图片成为块级元素,然后再margin:auto,图片就居中了,居中是为了让图片自适应看起来更舒服。

第三步:用上面的类名给图片一个最大宽100%,代码如下:

.carousel-inner {
max-width: 100%;
}

如此便可实现phpcms文章页的图片自适应了,此方法绝对有效,大家可直接使用。

so,博客已经在改版中,不久新版将和大家见面。

版权声明:本文为博主原创文章,未经博主允许不得转载。
 
如果本文帮助到了您,请点击下面的广告赞助一下,谢谢!

上一篇:屏蔽地域、识别终端和判断搜索引擎来源的PHP代码 下一篇:点击文字即可将文字复制到粘贴板的实现方法