之前的教程，基本带大家走完了电脑端网站的建造与功能优化流程。
但网站不光要考虑电脑屏幕的显示效果，移动端也是不能忽略的。
接下来，我们就一起尝试：
01
当前版本的显示效果
首先，我们得知道如何才能在Google AI Studio里预览网站在移动端的显示效果。
点击图中最右边的正方形四角logo，即可完整显示网页在当前设备的显示效果。
接着，按下键盘的F12，即可看见下图中的界面。
在这里，你可以选择不同手机或平板的尺寸，进行网站的移动端效果预览。
如图我们可以看见，虽然Google AI Studio已经悄悄做了移动端的适配。
但未经人工指导调试的移动端仍然无法很好地在一个页面完整显示所有必要的功能
现有问题
切换汉字的板块跟汉字展示的板块不能同时完整地显示在一个界面，从而导致用户使用网站时的体验感很割裂。
02
一句话优化移动端显示
因此，我又专门跟它强调：
“在当前网页端功能UI不变的前提下，为该网页做移动端适配”
很快，它就给出了更佳的适配效果，同一个页面就能体验网站每个板块完整的功能。
当前板块只有三个，如果是五六个板块，可以加入一个菜单按钮，将不同板块都藏入菜单内。
保证了界面的布局清晰，也方便用户使用，一举多得。
更多有关移动端适配的技巧，可以直接在chat对话框咨询AI。
