MUFY美化规范
⚠️更新后可能出现的严重冲突
1. 请各位创作者去掉卡片中的min-height: 100vh,这样输入框就不会异常了
⚠️更新后可能存在的冲突
1. 输入框部分,由原有的 #chatInput 更换为 #mufy_chat_input_container
替换代码中#chatInput后可解决冲突
2. 版本更新亮度调节功能,背景遮罩元素调整。

若原有代码中存在修改背景遮罩部分,修改为 #mufy_background_overlay
3. 更新打包后,原ai气泡框动态码._message_6hyew_1更换,可能造成ai气泡框美化失效
使用规范.mufy_ai_message_bubble 即可解决冲突
快速开始
文档整理了官方推荐的美化规范。
遵循本规范,可以减少版本更新后的兼容性问题,快速定位页面中的美化元素。
快速开始美化编写
目标:实现mufy的ai气泡框美化
1. 在文档中找到 AI气泡框 的定位符(如:.mufy_ai_message_bubble )
2. 将定位符和你的美化需求发给AI,例如:
3. 获取到ai生成的代码,用<style>...</style>包裹,放建卡小剧场即可
快速检索美化定位符
名称
定位
聊天背景/聊天背景图
#mufy_background_image
聊天背景/聊天背景遮罩
#mufy_background_overlay
顶部栏/顶部栏容器
#mufy_chat_header
顶部栏/返回按钮
#mufy_back_button
顶部栏/关注按钮
#mufy_header_follow_btn
顶部栏/亮度按钮
#mufy_header_clarity_btn
顶部栏/消息按钮
#mufy_header_message_btn
顶部栏/更多按钮
#mufy_header_more_btn
输入框/输入框容器
#mufy_chat_input_container
输入框/输入框框体
#mufy_chat_input_box
输入框/重说按钮
#mufy_chat_input_replay_btn
输入框/模型按钮
#mufy_chat_input_model_btn
作者的话
#mufy_author_note
聊天操作/按钮
#mufy_message_actions_btn
聊天操作/容器
#mufy_message_actions_box
聊天操作/删除
#mufy_message_actions_delete
聊天操作/修改
#mufy_message_actions_edit
聊天操作/复制
#mufy_message_actions_copy
气泡框/Ai气泡框
.mufy_ai_message_bubble
气泡框/用户气泡框
.mufy_user_message_bubble
系统设定
.mufy_message_system
心理叙述
.mufy_message_narration
代码块
.mufy_code_block
加重句
.mufy_emphasis_text
Last updated