如何用AI开发完整的小程序＜7＞—让AI微调UI排版
上一节我们介绍了如何让AI修改整体UI视觉效果。
不过有时候AI调整的并不理想，一些UI的布局还是需要微调。
比如已经实现的这个开始页面，我觉得标题太高了，这时候可以自己调，也可以让AI单独调，下面详细介绍。
一、手动调整UI布局
1、首先在wxml中找到标题对应的class名
我们发现代码中标题的代码结果如下：
<text class="main-title">修仙太难了</text>
这代表标题-修仙太难了是一个text（文本）类型，class="main-title"相当于给它起了英文名字main-title。
注意这些class名是AI自己定义的，大概率都不一样。
我们发现修仙太难了的class="main-title"。然后它又被包括在class="title-area"里面。
同时我们发现，单机版，slogan都被包在了title-area里面。
这就好像在界面上创建了一个大的区域命名为title-area（父容器），然后又在它里面画了main-title，sub-title和slogan（子组件）。
我修改一下title-area的颜色（如下图）就会很清楚的看到这个关系。
2、调整“修仙太难了”的排版布局
我们在wxss中搜索（Ctrl+f）title-area。（标题的父容器）
搜到的代码块如下，这些代码都是控制标题的排版布局，颜色，字体相关的。
比如现在在title-area中margin-top: 80rpx;我将其改为120，代表距离顶部更远，也就是往下调整一些。
如果你想知道每个字段分别都是啥意思，直接复制丢给AI让它解释即可，这里我就不介绍了。
二、总结说明
本节主要介绍wxml和wxss的关系，两个文件主要都是控制页面布局排版和效果的。
wxml控制整个页面有哪些元素，wxss中主要控制每个元素的位置，大小，颜色等。
当然其实有可以不要wxss，将wxss中的所有代码放到wxml里面也行。但是这样就不方便管理和调整了。
注意：我们其实也完全不需要知道代码意思，只需知道哪里是控制哪里的即可，然后修改调整哪里的时候，直接将相关的代码复制给AI让它修改即可。
比如我现在觉得踏入仙途按钮里面的字体没有上下居中，就可以直接让AI修改
以下按钮（踏入仙途）代码，中的文字没有上下居中，请优化：
然后把具体的按钮相关wxss代码丢给AI
以下是我微调之后的UI。
tips：Ctrl+/ 快速注释不想要的代码段，再按取消注释，当然也可以直接删掉
--完--