各位大侠，怎么设置电脑版每行4个版块，手机版每行2个版块？
各位大侠，怎么设置电脑版每行4个版块，手机版每行2个版块？目前我发现Discuz X3.5，电脑版和手机版的社区版块横排显示几个，只能一起设置啊，
但是明显电脑版一横排可以多显示几个版块，而手机一横排只能显示2个比较合适，
这就需要把电脑版和手机版的横排显示版块数量分别来设置啊，
怎么分别设置呢？有大侠知道吗？请指教。谢谢啦！
我知道答案 回答被采纳将会获得1 贡献 已有1人回答 3.5的默认手机模板板块显示不全，只能显示三个，其余的一定要往左拉动才能看到，唉 在Discuz X3.5中，默认情况下，电脑版和手机版的版块横排显示数量是统一的，无法直接通过后台设置分别调整。不过，你可以通过修改模板文件来实现电脑版和手机版分别显示不同数量的版块。
以下是实现步骤：
### 1. 修改电脑版模板
首先，找到电脑版的模板文件，通常位于 `template/default/forum/discuz.htm` 或 `template/你的模板目录/forum/discuz.htm`。
在模板文件中，找到控制版块显示的代码部分。通常，版块的显示是通过循环输出的，类似于以下代码：
<!--{loop $catlist $key $cat}-->
<div class="forumlist">
<!--{loop $cat['forums'] $fid $forum}-->
<div class="forumitem">
<!-- 版块内容 -->
</div>
<!--{/loop}-->
</div>
<!--{/loop}-->
你可以通过修改CSS样式来控制每行显示的版块数量。例如，设置每行显示4个版块：
.forumlist {
display: flex;
flex-wrap: wrap;
}
.forumitem {
width: 25%; /* 每行显示4个版块 */
}
### 2. 修改手机版模板
接下来，找到手机版的模板文件，通常位于 `template/default/mobile/forum/discuz.htm` 或 `template/你的模板目录/mobile/forum/discuz.htm`。
同样地，找到控制版块显示的代码部分，并修改CSS样式来控制每行显示的版块数量。例如，设置每行显示2个版块：
.forumlist {
display: flex;
flex-wrap: wrap;
}
.forumitem {
width: 50%; /* 每行显示2个版块 */
}
### 3. 使用媒体查询
如果你希望在同一模板文件中实现不同设备的显示效果，可以使用CSS的媒体查询功能。例如：
/* 默认样式，适用于电脑版 */
.forumlist {
display: flex;
flex-wrap: wrap;
}
.forumitem {
width: 25%; /* 每行显示4个版块 */
}
/* 手机版样式 */
@media screen and (max-width: 768px) {
.forumitem {
width: 50%; /* 每行显示2个版块 */
}
}
### 4. 清除缓存
修改完成后，记得在Discuz后台清除缓存，以确保修改生效。
### 总结
通过修改模板文件和CSS样式，你可以实现电脑版和手机版分别显示不同数量的版块。如果你对模板修改不熟悉，建议在修改前备份相关文件，以免出现意外情况。
如果你有更多问题，欢迎继续提问！
-- 本回答由 人工智能 AI智能体 生成，内容仅供参考，请仔细甄别。 要实现电脑版每行显示4个版块，手机版每行显示2个版块的效果，可以通过修改模板文件和CSS来实现。以下是具体的步骤：
### 1. 修改模板文件
首先，你需要找到并修改Discuz的模板文件，通常是`template/default/forum/discuz.htm`。你可以通过FTP工具或者后台的文件管理功能找到这个文件。
#### 1.1 找到版块循环的部分
在`discuz.htm`文件中，找到版块循环的部分，通常是类似以下的代码：
<!--{loop $forumlist $forum}-->
<div class="forum-item">
<!-- 版块内容 -->
</div>
<!--{/loop}-->
#### 1.2 添加条件判断
在这个循环中，添加条件判断，根据设备类型（电脑或手机）来设置不同的CSS类。你可以使用Discuz的`$_G['mobile']`变量来判断当前是否是移动设备。
<!--{loop $forumlist $forum}-->
<div class="forum-item <!--{if $_G['mobile']}-->mobile<!--{else}-->desktop<!--{/if}-->">
<!-- 版块内容 -->
</div>
<!--{/loop}-->
### 2. 修改CSS文件
接下来，你需要修改CSS文件，通常是`template/default/common/common.css`，来定义不同设备下的版块宽度。
#### 2.1 添加CSS样式
在`common.css`文件中，添加以下样式：
/* 电脑版样式 */
.forum-item.desktop {
width: 25%; /* 每行4个版块 */
float: left;
box-sizing: border-box;
}
/* 手机版样式 */
.forum-item.mobile {
width: 50%; /* 每行2个版块 */
float: left;
box-sizing: border-box;
}
### 3. 清除缓存
修改完成后，记得在Discuz后台清除缓存，确保修改生效。
### 4. 测试
最后，分别在电脑和手机上访问你的网站，检查版块显示是否符合预期。
### 注意事项
- 如果你使用的是自定义模板，路径可能会有所不同，请根据实际情况调整。
- 修改模板文件和CSS文件前，建议先备份，以防出现问题可以快速恢复。
通过以上步骤，你就可以实现电脑版每行显示4个版块，手机版每行显示2个版块的效果了。如果有其他问题，欢迎继续提问！
-- 本回答由 人工智能 AI智能体 生成，内容仅供参考，请仔细甄别。
页:
[1]