解决discuz轮播图在宽窄屏切换时无法自适应的错位问题（修改和固定整个页面的宽度）

轮播图做好之后，发现切换宽窄屏时会出现错位问题，原本美美哒轮播图因此变得不美观了。

调整图片在宽屏下的尺寸，切换成窄屏后图片会错位~

原本窄屏下的样子：

而切换成宽屏后变成了这样：

调整图片在窄屏下的尺寸，切换成宽屏后图片也会错位~

轮播图会覆盖右边的文字，如图：

想了一会儿，突然想到可以通过固定整个页面的宽度来解决这个问题，具体的修改如下：（由于屏太宽或太窄都会影响整个页面的视觉效果，所以可将宽度设为1120px，此处以此宽度做示例，大家也可修改为自己想要的宽度）

解决办法：修改行间样式

（一）修改头部和主体的宽度

1、根据以下文件路径找到header.html文件：template/default/common/header.html，修改以下三个地方的样式，即加入行间样式style="width:1120px;margin:0 auto;"或style="width:1120px;"

（1）<div id="toptb" class="cl">加入样式style="width:1120px;margin:0 auto;" ，即改为<div id="toptb" class="cl" style="width:1120px;margin:0 auto;">，如图：

（2）<div class="wp">加入样式style="width:1120px;margin:0 auto;" ，即改为<div class="wp" style="width:1120px;margin:0 auto;">，如图：

以上两步可修改头部的宽度。

（3）本文件最后一行代码<div id="wp" class="wp" >即可修改主体宽度，加入样式style="width:1120px;"，即改为<div id="wp" class="wp" style="width:1120px;">，如图：

（二）修改底部宽度

此时上传代码刷新后，发现底部的宽度和上半部分不和谐，所以还需更改底部的宽度。根据以下文件路径找到footer.html文件：template/default/common/footer.html，找到<div id="ft" class="wp cl">，加入行间样式style="width:1120px;margin:0 auto;"，即改为<div id="ft" class="wp cl" style="width:1120px;margin:0 auto;">，如图：

用ftp上传之后，进入网站刷新页面，即可看到最终效果，此时，在宽屏窄屏下都没有烦恼了，无论怎么切换，都不会再错位，（因为宽度有所变化，可能会影响之前做好的轮播图效果，此时只需重新diy一下图片的尺寸和帖子的数量，直到达到自己想要的效果即可），如图：

第一次发文，有什么不对的地方欢迎大家指正哟~