- 欢迎来到存档计划(Lake桑的存档馆)!
- 看看站长的新皮肤Lakeus。
- 欢迎加入Discord服务器:W56rsgK。
- 加入QQ频道:存档计划编辑交流。
- 我们搬迁到新域名啦:lakeus.xyz
- 也来看看WordPress.com分馆。
- 点击这里查看梗体中文相关内容!
- ..-/-./-/../-/.-.././-../..-./.-./.-/--./--/./-./-

使用笔记/移动设备优化篇
From Project Archive by Lakejason0
< 使用笔记
该页面尚未完成。
你可以帮助我们扩充关于该主题的更多信息。
该页面的编辑正在进行中。
请帮助我们扩充或改进这篇文章。
MediaWiki的默认皮肤Vector对移动端其实没有特别的优化。虽然一部分皮肤自带了响应式设计,但是一些页面(比如最近更改和历史差异)依然对手机很不友好。以下将介绍MediaWiki上的移动设备优化。
MobileFrontend[edit | edit source]
MobileFrontend添加了移动端视图(为移动设备显示特定的皮肤)与一部分特殊页面的移动设备优化版本,调整了部分元素在移动端的显示效果。其可以说提供了最基本的移动设备体验优化。
根据安装提示安装完毕后,你的站点应当可以检测设备尺寸并自动展示对应的视图了。
在安装完这个扩展程序后,站点的CSS和JS就需要做出相应的调整了。将桌面端视图专用的CSS和JS放在Common.css与Common.js内,而移动端视图专用的则应当放到Mobile.css与Mobile.js内。若启用了Gadgets,则可以把两个视图通用的CSS与JS放在一个targets
设置为desktop,mobile
的Gadget里面。我站分别是MediaWiki:Gadget-site-styles.css和MediaWiki:Gadget-site.js。
但是,很有可能你并没有在一开始就区分好哪些是移动端专用的。这时你就需要考虑自己优化。
扩展程序不能帮你解决所有问题[edit | edit source]
在移动端视图,你很有可能会遇到页面宽度超限的情况。
但是遗憾的是,扩展程序不能自动修复这些问题——也就是说,如果你写了一个特别大的表格,那么手机端很可能没法好好查看。
遇到这种情况,你就需要自行应用一些CSS。以下介绍一些常见问题及其优化方法。
常见问题[edit | edit source]
大表格超宽[edit | edit source]
模板超宽或需要在不同的屏幕尺寸上显示不同的布局[edit | edit source]
部分扩展程序不能在移动版视图工作[edit | edit source]
主要页面 | |
---|---|
正文 | |
外部链接 |