# 使用华为云Astro轻应用管理应用中标准页面的主题
华为云Astro轻应用预置了很多默认样式，供您选择使用，同时也支持对标准页面的主题样式进行自定义修改。自定义主题时，可以自定义修改标准页面的样式。设置完成并启用主题后，该应用中标准页面相同组件的展示，将以主题中配置的为准。
![](https://support.huaweicloud.com/usermanual-astrozero/public_sys-resources/note_3.0-zh-cn.png)
自定义主题样式需要您熟悉CSS的Less代码编写规范，关于Less介绍，请参见[Less介绍](https://less.bootcss.com/)。
#### 自定义主题样式
1. 参考[登录华为云Astro轻应用应用设计器](https://support.huaweicloud.com/usermanual-astrozero/astrozero_05_9004.html)中操作，登录应用设计器。
   
   例如，在标准页面中添加一个"表单"组件，如何添加组件请参见[为华为云Astro轻应用标准页面添加组件](https://support.huaweicloud.com/usermanual-astrozero/astrozero_05_9062.html)。为组件绑定数据对象为"Alarm"，选择前三个字段，添加"保存"和"重置"按钮，单击"完成"。单击"保存"按钮，再单击"预览"按钮，效果如[图1]所示，当前输入框的背景颜色为白色。
   图1标准页面   
   ![](https://support.huaweicloud.com/usermanual-astrozero/zh-cn_image_0000001912810744.png "点击放大")
   
   
2. 在左侧导航栏中，选择"设置"，进入应用设置页面。
3. 在应用设置页面，单击"主题管理"。
4. 在主题列表中，单击对应主题后的![](https://support.huaweicloud.com/usermanual-astrozero/zh-cn_image_0000001945321509.png)，进入编辑主题页面。
5. 修改相关的组件样式代码。 
   例如，在输入框组件添加一个背景色，设置为红色，如[图2]。
   图2添加背景色   
   ![](https://support.huaweicloud.com/usermanual-astrozero/zh-cn_image_0000001912642388.png "点击放大")
   
   
6. 修改样式后，单击页面右上方的"保存"，进行编译保存。 
   ![](https://support.huaweicloud.com/usermanual-astrozero/public_sys-resources/note_3.0-zh-cn.png)
   若编译不成功，请先禁用该主题，再进行编辑。
   
   
7. 返回"应用设置 \> 主题管理"页面，打开对应主题后的"OFF"，启用该主题。
8. 返回标准页面开发界面，单击页面上方的![](https://support.huaweicloud.com/usermanual-astrozero/zh-cn_image_0000001912642396.png)，在预览页面可查看到自定义样式后的效果，如[图3]。
   
   图3定义样式后的效果   
   ![](https://support.huaweicloud.com/usermanual-astrozero/zh-cn_image_0000001945321521.png "点击放大")
   
   
9. （可选）管理标准页面主题。 
   标准页面主题创建后，在主题管理中，可管理已创建的主题。
   - 启用主题：在主题列表中，单击主题后的![](https://support.huaweicloud.com/usermanual-astrozero/zh-cn_image_0000001983966297.png)，启用该主题。
   
   - 禁用主题：在主题列表中，单击主题后的![](https://support.huaweicloud.com/usermanual-astrozero/zh-cn_image_0000001951566950.png)，禁用该主题。
   
   - 编辑主题：主题禁用后，单击![](https://support.huaweicloud.com/usermanual-astrozero/zh-cn_image_0000001983806457.png)，可更改该主题。
   
   - 删除主题：主题禁用后，单击![](https://support.huaweicloud.com/usermanual-astrozero/zh-cn_image_0000001983966301.png)，可删除该主题。
     **晴光蓝为系统预置主题，暂不支持编辑、删除。**