Discuz手机图显示太小和字体行距太近的问题解决方法

209167

不知道是出于什么原因，Discuz手机触屏版把图片做得特别的小。在上传时，它会生成一张手机版的缩略图，尺寸很小，就算在CSS模板上把尺寸放大，也会把图片扩展得模糊不清，在手机模板上，图片的高宽尺寸被设置得特别小，一般是140px这样。
/ u) L+ f5 @+ ?. B
7 V* {+ A, D' H; V% Q& l网上有很多教程，但是都不全面或者解决不了这个问题。今天特别收集了有效的方法，分享给大家：
" q8 ?5 S8 O3 E+ P3 {7 G1，打开后台设置（管理中心），后台——全局——上传设置——基本设置——是否生成手机版缩略图，这里选择“否”；
2、调整触屏版图片尺寸，打开\template\default\touch\forum\discuzcode.htm文件，找到以下代码

1. $fix = count($post[imagelist]) == 1 ? 140 : 83;

复制代码

找到这段代码后，把数值改一下，修改好的代码如下：

1. $fix = count($post[imagelist]) == 1 ? 650 : 800;

复制代码

相当于把140px宽的小图改成宽650px、高800px，差不多就是大屏幕手机的实际尺寸了。在此建议电脑版图片上传时的设置最大宽度不超过800px，否则加载速度会特别慢哦（电脑版图片大小设置路径：后台-界面-界面设置-帖子内容页-帖子图片最大宽度）。
+ q7 ]+ _9 T( J% i' R) x继续找出以下代码
, W( [& F8 J& z) V9 ~. s2 o

1. $mobilethumburl = $attach['attachimg'] && $_G['setting']['showimages'] && (!$attach['price'] || $attach['payed']) && ($_G['group']['allowgetimage'] || $_G['uid'] == $attach['uid']) ? getforumimg($attach['aid'], 0, 140, 140, 'fixnone') : '' ;

复制代码

修改数值，修改后如下：
+ ^4 K2 v/ {9 y* i: I5 u

1. $mobilethumburl = $attach['attachimg'] && $_G['setting']['showimages'] && (!$attach['price'] || $attach['payed']) && ($_G['group']['allowgetimage'] || $_G['uid'] == $attach['uid']) ? getforumimg($attach['aid'], 0, 650, 800, 'fixnone') : '' ;

复制代码

. S# @/ w3 J2 n3 V3，CSS调整，打开\static\image\mobile\style.css，找到如下代码：

1. .plc .pi .message img,.plc .pi .img_one img { margin:0px 4px 0px 0; max-width:140px; max-height:140px; }

复制代码

修身为如下代码：
6 K6 S1 x% X9 @3 ~' b2 X  |

1. .plc .pi .message img,.plc .pi .img_one img {max-width:98%; display:block;vertical-align: middle;margin-bottom:4px;}

复制代码

看到了吗，CSS也一样限制了高和宽的，我们改为按屏幕尺寸的百分比来进行显示，为了不撑破屏幕布局，请不要设置成100%了，建议98%即可。都设置好以后，在后台更新一下模板的缓存，触屏版的图片显示就正常了，如果还有疑问，请关注微信公众号「拾叁庄」，留言说明问题，我会尽快为你解答。
& V0 [% M- G5 `7 b- Y
接着，说说帖子字体行间距离的问题。
2 x- K( v/ d- I3 o: k平时发帖写文章，如果不注意排版，那么你有没有发觉整个版面密密麻麻很不美观？其实主要是每行字的距离靠得太近了，看久了眼睛容易累，而且阅读时容易跳行或者漏行。我们只要把字行间距设置一下就好了，至少看着会美观不少。
% M" S) F; Q8 K/ m( @8 M, X3 J修改方法很简单：
0 y" n1 E( Q# `, ^; y3 w6 K打开Discuz后台——界面——风格管理——找到正在使用的风格模板——点击编辑——帖子内容字号——14px;
4 u5 [% G& ?5 q, l- S默认值是14px，我们在这个默认值的后面加上一个参数，变成：14px; line-height:2   （参数里的2代表行间距，你可以自行修改，如果改为3的话，间距就比较大了，不过也还可以接受，我觉得2就行了）
1 w1 x' j) {2 V+ g0 ~/ e. L$ p/ \
怎么样？以上都解决你的问题了吗？
' S, i! m, d' }4 e6 X

田七

不错，很实用的方法，不同版本都能使用这个技巧哦，希望后期官方也能完善这个不足。