公共部分包括一些常用样式,如:
.j-cotainer:最外容器
.j-title:标题
.j-title-b:大标题
.j-clear:清除浮动
.j-img:图片宽度撑满容器
.j-text-ellipsis:文本超出显示“...”
.j-left:左浮动
.j-right:又浮动
.j-clear:清除浮动
.j-block-center:块级元素居中
.j-show:显示元素
.j-hide:隐藏元素
.j-hide-d:在PC端隐藏元素
.j-hide-m:在Mobile端隐藏元素
.j-pointer:PC端指针变成手
.j-disable:不可点击(透明度0.6)
titlebig title
文本相关
.j-text-left(居左)
.j-text-center(居中)
.j-text-right(居右)
.j-text-bold(粗体)
.j-decoration-through(穿过文本的一条线)
.j-decoration-under(文本下的一条线)
leftcenterrightbold
文本超出显示...
.j-text-ellipsis
文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长
文本超出2行显示...
.j-text-ellipsis-2
注意:因给firefox暂不支持该样式,所以需要做兼容出来,需要根据实际情况设置高度,超出2行将会不显示,也不现实...
文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长
文本超出3行显示...
.j-text-ellipsis-3
注意:因给firefox暂不支持该样式,所以需要做兼容出来,需要根据实际情况设置高度,超出2行将会不显示,也不现实...
文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长文本过长
圆角框
根据圆角大小分为.j-radius-2、.j-radius-4、.j-radius-6、.j-radius-8、.j-radius-full
.j-radius-full为圆形
注:圆角加入了overflow:hidden样式,导致有些需要浮动到边界外的元素无法正常显示,请自行修改overflow:visible
.j-left,.j-right控制元素左右浮动
.j-clear用来请除浮动
.j-block-center控制块级元素居中
左浮动右浮动我是个块级元素
display相关:
.j-block元素display属性值为block
.j-inline元素display属性值为inline
.j-inline-block元素display属性值为inline-block
块级元素1块级元素2块级元素3行内元素1行内元素2行内元素3行内块级元素1行内块级元素2行内块级元素3
定位相关
.j-relative元素相对定位
.j-absolute元素绝对定位
.j-fixed元素相对于窗口绝对定位
.j-fixed-top元素相对于窗口绝对定位,居于窗口顶部
.j-fixed-bottom元素相对于窗口绝对定位,居于窗口底部
元素相对定位元素绝对定位元素相对于窗口绝对定位元素相对于窗口绝对定位,居于窗口顶部元素相对于窗口绝对定位,居于窗口底部
.j-hide-d控制元素在PC端不显示
.j-hide-m控制元素在Mobile端不显示
注:你可以切换浏览器模式查看效果
.j-pointer,在PC端指针变成手,即:cursor: pointer
.j-disable,元素不可点击
点击点击
.j-nocopy: 移动端禁止复制文字图片
测试文案
使用方式和fa类似,.j-icon加上对应的图标名称的类,如:.j-icon-x,就是X图标
rotateForever
fadeIn
fadeOut
slideInUp
slideOutDown
一级标题“.j-word-title-l”,居中显示
二级标题“.j-word-title”,三级标题“.j-word-title-s”
文本内容每段为“.j-word-content”,内用“p”作为小段
三级标题后的“.j-word-content”自动缩进与标题对齐
列表为“.j-word-list”,内每一项为“.j-word-list-item”,每项前带“·”
文本内图片为“.j-word-img”,图片自动居中
注释为“.j-word-annotation”,居中
情绪就像是我们状态的晴雨表,我们每个人在不同的情境下会产生不同的情绪体验。在第一个情绪分享日中,我们将为大家介绍关于情绪的基本知识,帮助大家梳理正确的情绪意识,重新认识并学会区分我们日常生活中的。
在今天的知识分享中,你将了解到以下内容:
情绪就像是我们状态的晴雨表,我们每个人在不同的情境下会产生不同的情绪体验。在第一个情绪分享日中,我们将为大家介绍关于情绪的基本知识,帮助大家梳理正确的情绪意识,重新认识并学会区分我们日常生活中的。
在今天的知识分享中,你将了解到以下内容:
情绪就像是我们状态的晴雨表,我们每个人在不同的情境下会产生不同的情绪体验。在第一个情绪分享日中,我们将为大家介绍关于情绪的基本知识,帮助大家梳理正确的情绪意识,重新认识并学会区分我们日常生活中的。
在今天的知识分享中,你将了解到以下内容:

DAY1 要点整理DAY1 要点整理情绪就像是我们状态的晴雨表,我们每个人在不同的情境下会产生不同的情绪体验。在第一个情绪分享日中,我们将为大家介绍关于情绪的基本知识,帮助大家梳理正确的情绪意识,重新认识并学会区分我们日常生活中的。
在今天的知识分享中,你将了解到以下内容:
1.DAY1 要点整理情绪就像是我们状态的晴雨表,我们每个人在不同的情境下会产生不同的情绪体验。在第一个情绪分享日中,我们将为大家介绍关于情绪的基本知识,帮助大家梳理正确的情绪意识,重新认识并学会区分我们日常生活中的。
在今天的知识分享中,你将了解到以下内容:
情绪就像是我们状态的晴雨表,我们每个人在不同的情境下会产生不同的情绪体验。在第一个情绪分享日中,我们将为大家介绍关于情绪的基本知识,帮助大家梳理正确的情绪意识,重新认识并学会区分我们日常生活中的。
在今天的知识分享中,你将了解到以下内容:
3.DAY1 要点整理识别生活中的表达模式,将模糊的情绪清晰化识别生活中的表达模式,将模糊的情绪清晰化DAY1 要点整理识别生活中的表达模式,将模糊的情绪清晰化识别生活中的表达模式,将模糊的情绪清晰化
图片注释
栅格包含自适应屏幕,但仅适配PC和Mobile两个端
栅格必须包裹在“.j-row”容器内使用,分12列,栅格需加“.j-col”样式
PC端样式为:在“.j-col-”后加比例,如:.j-col-1-4,即列宽为容器的四分之一,撑满12列为full,如:.j-col-full,即PC端撑满12列
Mobile端样式为:在“.j-col-”后加“m-”再加比例,如:.j-col-m-1-2,即列宽为容器的二分之一,撑满12列同样为full,如:.j-col-m-full
按钮分为普通、边框、取消、危险、透明几种不同样式,每种样式均包括大、中、小三种
每种按钮都可以通过添加“j-btn-disable”设为禁用状态
按钮默认为行内块级元素
btnbtnbtnbtnbtnbtnbtnbtnbtnbtnbtnbtnbtnbtnbtnbtnbtnbtnbtnbtn
标签包括普通、边框两种样式
默认左浮动,请给外层容器使用“.j-clear”清除浮动
tag1tag2tag3tag1tag2tag3
分页自适应PC端和Mobile端,PC端居左对其,Mobile端平均分布
".active"为选中状态
可以添加公共样式中的".j-disable"将设为不可点击状态
.j-tab-item里也可以不是链接
tab1tab2tab3
卡片默认间隔为灰色横条,默认左右内边距均为16px
j-card-noborder控制是否有底部间隔灰线
卡片1内容
卡片2内容
卡片3内容
卡片1内容
卡片2内容
卡片3内容
j-border-bottom-8卡片分隔变为8px灰线
卡片1内容
卡片2内容
卡片3内容
卡片1内容
卡片2内容
卡片3内容
j-card-noborder和j-card-single一起使用可以生产四周都有边距的卡片
卡片1内容
卡片2内容
卡片3内容
卡片1内容
卡片2内容
卡片3内容
整个列表一定要包裹在“.j-list”内
每个组包裹在“.j-list-group”中,中间有灰色空格
标题为“.j-list-title”;图标为“.j-list-icon”,可没有图标;副标题为“.j-list-sub”;数字气泡为“.j-list-bubble”,均可用“.j-left”和“.j-right”控制居左或居右
“.j-list-sub”中的数字使用".j-list-sub-num"
".j-list-group"的分隔也用“.j-border-bottom-8”控制
注:list组件固定高度60px,需要自适应高度的列表可用card组件
列表每行的分隔线默认是贯通的,如果需要左右不顶边的分割线可以在“.j-list-item”层添加“.j-list-item-margin-l”和“.j-list-item-margin-r”来分别使分割线左右不顶边
表单所有内容都要包含在容器“.j-form”中
表单介绍“j-form-des”:
表单介绍内含有介绍标题“j-form-des-title”和介绍内容“j-form-des-text”,介绍内容内用p分段
介绍内容中的链接为蓝色
专业预嘱是预先制定的一个计划,在咨询师意外死亡,或意外受伤、生病,无法处理和安排工作时,最大限度地确保咨询师的咨询工作能顺利延续下去,减低来访者因咨询中断造成的影响,保护咨询师的家人和同事免于被迫为咨询师处理工作事务的巨大困难和压力。
这个《专业预嘱信息登记表》将协助你完成这一计划的制定,提供给简单心理必要的信息,用于贯彻《简单心理合作咨询师专业预嘱协议》所必须执行的任务,尽力安排你在简单心理的咨询工作。
注意:
1、填写《专业预嘱信息登记表》的第一步,请确认已经阅读并接受《简单心理合作咨询师专业预嘱协议》
2、为了此登记表的实用性和有效性,请定期检查和更新登记表内的信息。
这里是表单简介的标题专业预嘱是预先制定的一个计划,在咨询师意外死亡,或意外受伤、生病,无法处理和安排工作时,最大限度地确保咨询师的咨询工作能顺利延续下去,减低来访者因咨询中断造成的影响,保护咨询师的家人和同事免于被迫为咨询师处理工作事务的巨大困难和压力。
这个《专业预嘱信息登记表》将协助你完成这一计划的制定,提供给简单心理必要的信息,用于贯彻《简单心理合作咨询师专业预嘱协议》所必须执行的任务,尽力安排你在简单心理的咨询工作。
注意:
1、填写《专业预嘱信息登记表》的第一步,请确认已经阅读并接受《简单心理合作咨询师专业预嘱协议》
2、为了此登记表的实用性和有效性,请定期检查和更新登记表内的信息。
表单域“j-form-field”:
表单域的标题,行间距是33px。表单域的标题,行间距是33px。姓名性别
表单域标题带介绍
1、请按完成培训从前到后的时间顺序,填写1-2年以上的系统训练,请勿填写短期培训。
2、请仅填写完成课程并且获得毕业证书的培训,不包括肄业或正在接受的情况。
3、培训信息经审核后将在你的个人页面“资质与受训”栏目,按照您目前的填写顺序展示,请确保描述符合课程方的建议与要求。如下拉项中没有你所参加的培训信息,请选择“其它”并输入准确的培训名称及主办机构。
表单域的标题1、请按完成培训从前到后的时间顺序,填写1-2年以上的系统训练,请勿填写短期培训。
2、请仅填写完成课程并且获得毕业证书的培训,不包括肄业或正在接受的情况。
3、培训信息经审核后将在你的个人页面“资质与受训”栏目,按照您目前的填写顺序展示,请确保描述符合课程方的建议与要求。如下拉项中没有你所参加的培训信息,请选择“其它”并输入准确的培训名称及主办机构。
姓名
表单域标题也可以只有介绍
1、请按完成培训从前到后的时间顺序,填写1-2年以上的系统训练,请勿填写短期培训。
2、请仅填写完成课程并且获得毕业证书的培训,不包括肄业或正在接受的情况。
3、培训信息经审核后将在你的个人页面“资质与受训”栏目,按照您目前的填写顺序展示,请确保描述符合课程方的建议与要求。如下拉项中没有你所参加的培训信息,请选择“其它”并输入准确的培训名称及主办机构。
1、请按完成培训从前到后的时间顺序,填写1-2年以上的系统训练,请勿填写短期培训。
2、请仅填写完成课程并且获得毕业证书的培训,不包括肄业或正在接受的情况。
3、培训信息经审核后将在你的个人页面“资质与受训”栏目,按照您目前的填写顺序展示,请确保描述符合课程方的建议与要求。如下拉项中没有你所参加的培训信息,请选择“其它”并输入准确的培训名称及主办机构。
姓名
可重复的表单域
表单域的标题资质证明证书编号资质证明证书编号删除该资质证明添加更多资质证明
表单组件包括输入框、文字输入区域、单选、多选、下拉菜单、搜索框
文本输入框和文本输入区域
输入框左右两侧添加按钮
leftright
单选框、多选框默认左浮动,请给外层容器使用“.j-clear”清除浮动
下拉菜单在PC和移动端有两种不同的样式(切换浏览器模式查看)
下拉框默认最大高度340px,超出部分滚动显示
请选择
下拉菜单支持分级显示操作,要在需要分级的几个select外添加“.j-form-select-group”,每个”添加“data-level”参数,确定级别,如“data-level="1"”
加入表单两级标题“j-form-title”、“j-form-title-s”
请选择与你相符的选项省/自治区/直辖市请选择市请选择区请选择
日期输入框、文件上传
滑动条
开关
不在form表单中使用时,为了更方便的控制开关样式,用j-switch-checked控制开关
搜索栏
提示窗口
默认悬浮,页面居中

加载成功
toast内可以没有图片
文案过长会自动折行
提示文案,文案过长会自动折行
ui_toast是toast的riot组件
在父级组件中引入ui_toast
ui_toast组件提供一个tag.toast(option)方法,在父级中调用,该方法接受一个对象参数option,option可包括
1. content:选填,string或number
2. type:选填,string,可选类型:success、fail、warn三种,用来显示toast的三种icon,默认或传入未知参数均不显示icon
3. time:选填,number,单位毫秒(ms),默认为1000
4. confirm:选填,function,toast消失时的回调函数
ui_toast
tag.toast({ content: '感谢+1' }) tag.toast({ content: '感谢+1', type: 'success' }) tag.toast('感谢+1', 3000{ content: '感谢+1', time: 3000 }) tag.toast({ content: '感谢+1', confirm: function() { ... } })
页面底部带有logo或其他功能的组件
底部为logo的bottom,仅移动端使用
局部遮罩适用于图片
使用时添加“j-mark-local”
注:局部遮罩使用绝对定位,父级需要添加“j-relative”

...
全屏遮罩适用于全屏loading等环境
使用时添加“j-mark-full”
注:全屏遮罩使用fixed定位,需要考虑z-index属性,默认100
...
轮播图使用riot制作为独立组件
名称为ui_banner
数据(JSON字符串)通过data-banner传入
data-type接受两种参数,image、background,默认image
- image:轮播图元素为img标签
- background:轮播图元素为div,图片为背景图
- data-height为当data-type="background"时,轮播图元素的高度,默认200px
- data-background-align为当data-type="background"时,轮播图背景图片的对齐方式,接受三个参数:left、center、right,默认center
- data-time为轮播图动画间隔时间,默认为5000(ms)
- data-pagination为轮播图分页标识是否显示,可选参数为“true”或“false”,默认为true
- data-radius为轮播图圆角,可选参数为2、4、6、8,默认为0
活动用轮播页(swiper)使用riot制作为独立组件
主要用于整屏轮播切换的H5活动页面
名称为ui_swiper
接受参数:
- data-direction:轮播滚动方向,x或y,默认x
- data-slide:轮播页是否支持触屏滚动,true或false,默认true
- data-loop:轮播页是否支持循环轮播,true或false,默认false
- data-reverse:轮播图是否反向滚动,true或false,默认false
注意:因为better-scroll插件并不支持反向滚动,该设置只是修改了滚动的起始位置,所有反向操作均为手动触发,所以向上和向左滚动的触发依然需要调用prev()方法,而不是next()方法
轮播页支持插入式开发,页中的内容可以在组件外部直接插入
...
或在riot组件中嵌套使用,如:
activity_... ui_swiper(data-slide="false") ...
加载
加载分为两种样式
列表中使用的样式
在.j-loading层加上.j-loading-list
整页中使用的样式
在.j-loading层加上.j-loading-page
整页模式在PC端为默认400px高,块级元素
在Mobile端为全屏遮罩
加载使用riot制作为独立组件
名称为ui_loading
数据(JSON字符串)通过data-banner传入
ui_loading接收一个参数,data-type,必填
- list:ui_loading为列表类加载样式
- page:ui_loading为整页加载样式
*注意:因为riot组件是异步加载的,所以当页面加载是就需要出现loading的页面,请在slim中使用html的方式添加,在riot组件中通过
ui_loading(data-type="{{list}}") ui_loading(data-type="{{page}}")
倒计时使用riot制作为独立组件
名称为ui_countdown
ui_countdown接收两个参数
- data-time为倒计时总计秒数,必填
- on-zero为倒计时为零时的回调函数,选填,function
注:为了方便在不同的地方服用,ui_countdown组件本身不提供任何样式,需要在父级中定义
ui_countdown.time(data-time="{{data.time}}" on-zero="{{zero}}")
可设置居中的logo

可设置居中的title
也可同时添加左右两侧的图标
简单心理
警告分为成功、提示、警告、错误四种样式,自动适应PC端和Mobile端
默认不吸顶,如需吸顶请在“.j-alert”层添加“.j-alert-fixed”样式,吸顶会自动去除边框和圆角样式
左侧icon和右侧close可依据情况添加或去除,文字会自动适应宽度
提示:咨询师本人承诺以上资料真实准确,接受公众监督,并为此承担相应法律责任。如果你发现有虚假信息。成功的通知:欢迎回来,Erin:)警告:修改咨询时间需提前24小时私信咨询师,24小时以内不能修改。错过咨询时间无法退款哦。错误:请填写以下必填项
.j-alert-icon和.j-alert-close可自行选择是否添加
提示:咨询师本人承诺以上资料真实准确,接受公众监督,并为此承担相应法律责任。如果你发现有虚假信息。成功的通知:欢迎回来,Erin:)警告:修改咨询时间需提前24小时私信咨询师,24小时以内不能修改。错过咨询时间无法退款哦。错误:请填写以下必填项
没有边框的样式,在“.j-alert”层添加“.j-alert-noborder”
仅PC端,移动端均不带边框和圆角
提示:咨询师本人承诺以上资料真实准确,接受公众监督,并为此承担相应法律责任。如果你发现有虚假信息。成功的通知:欢迎回来,Erin:)警告:修改咨询时间需提前24小时私信咨询师,24小时以内不能修改。错过咨询时间无法退款哦。错误:请填写以下必填项
更醒目的字体颜色
在“.j-alert-content”层添加“.j-alert-distinct”
成功的通知:欢迎回来,Erin:)警告:修改咨询时间需提前24小时私信咨询师,24小时以内不能修改。错过咨询时间无法退款哦。错误:请填写以下必填项
字体居中显示
在“.j-alert-content”层添加“.j-alert-center”
提示:咨询师本人承诺以上资料真实准确,接受公众监督,并为此承担相应法律责任。如果你发现有虚假信息。成功的通知:欢迎回来,Erin:)警告:修改咨询时间需提前24小时私信咨询师,24小时以内不能修改。错过咨询时间无法退款哦。错误:请填写以下必填项
弹窗
modal1modal2modal3modal4
ui_modal是modal的riot组件
在父级组件中引入ui_modal
ui_modal接受一个对象作为参数,参数包括:content、confirm_btn、cancel_btn、confirm
- content:string 弹窗显示的内容
- confirm_btn:string/false 确定按钮的文字内容,默认为“确定”,传入false时按钮不显示
- cancel_btn:string/false 取消按钮的文字内容,默认为“取消”,传入false时按钮不显示
- confirm_background:string 确定按钮背景颜色
- cancel_background:string 取消按钮背景颜色
- confirm_color:string 确定按钮文字颜色
- cancel_color:string 取消按钮文字颜色
- confirm:function 点击确定按钮执行的方法,默认为关闭窗口
ui_modal
tag.modal({ content: '我是弹窗文案', confirm_btn: '我是确定按钮文案', cancel_btn: '我是取消按钮文案', confirm: function() { ... } })
选择器
选择器可分为一级或多级(建议不要超过三级)
组件向父级提供tag.pickerToggle()方法,控制picker出现
picker数据通过data-picker传入
选择结果父级通过ref=“picker_result”接收
ui_picker data-picker=""
级联选择器
ui_picker data-type="linkage" data-picker=""
手风琴伸缩效果
1. 在简单心理可以做什么?
预约咨询
你可以通过网页或app方便地预约咨询。APP首页点击 “个体咨询”,可以浏览并选择你感兴趣的咨询师,单击进入页面了解关于咨询师的详细介绍。如果想预约ta,点击“预约咨询”。(如果该咨询师预约已满,按钮会变成 灰色并不可点击,你可以点击“订阅”,那么咨询师开放时间时会提醒你)
2. 如何在简单心理预约咨询?
1、注册简单心理:
推荐使用手机号进行注册,如果使用邮箱注册,请不要使用qq邮箱。
3. 咨询完成后,如何续约?
1.当你完成一次咨询后,可以在 我的-心理咨询 中找到对应的记录并续约
4. 简单心理在我们当地没有咨询师,该怎么办?
简单心理在我们本地没有咨询师,怎么办?
如果简单心理在你们当地没有咨询师,建议您尝试选择其他城市的咨询师,进行视频咨询。
5. 如何进行视频咨询?
目前视频咨询主要通过两种方式进行,QQ或Skype。在预约成功后,您可以看到咨询师提供的具体方式。
1. 在简单心理可以做什么?
在简单心理可以做什么?
预约咨询
你可以通过网页或app方便地预约咨询。APP首页点击 “个体咨询”,可以浏览并选择你感兴趣的咨询师,单击进入页面了解关于咨询师的详细介绍。如果想预约ta,点击“预约咨询”。(如果该咨询师预约已满,按钮会变成 灰色并不可点击,你可以点击“订阅”,那么咨询师开放时间时会提醒你)
2. 如何在简单心理预约咨询?
详细步骤说明:
1、注册简单心理:
推荐使用手机号进行注册,如果使用邮箱注册,请不要使用qq邮箱。3. 咨询完成后,如何续约?
咨询完成后,如何续约?
1.当你完成一次咨询后,可以在 我的-心理咨询 中找到对应的记录并续约4. 简单心理在我们当地没有咨询师,该怎么办?
简单心理在我们本地没有咨询师,怎么办?
简单心理在我们本地没有咨询师,怎么办?
如果简单心理在你们当地没有咨询师,建议您尝试选择其他城市的咨询师,进行视频咨询。5. 如何进行视频咨询?
如何进行视频咨询?
目前视频咨询主要通过两种方式进行,QQ或Skype。在预约成功后,您可以看到咨询师提供的具体方式。
可以在j-accordion层添加"data-animate",为手风琴伸缩效果添加动画
1. 在简单心理可以做什么?
预约咨询
你可以通过网页或app方便地预约咨询。APP首页点击 “个体咨询”,可以浏览并选择你感兴趣的咨询师,单击进入页面了解关于咨询师的详细介绍。如果想预约ta,点击“预约咨询”。(如果该咨询师预约已满,按钮会变成 灰色并不可点击,你可以点击“订阅”,那么咨询师开放时间时会提醒你)
2. 如何在简单心理预约咨询?
1、注册简单心理:
推荐使用手机号进行注册,如果使用邮箱注册,请不要使用qq邮箱。
3. 咨询完成后,如何续约?
1.当你完成一次咨询后,可以在 我的-心理咨询 中找到对应的记录并续约
4. 简单心理在我们当地没有咨询师,该怎么办?
简单心理在我们本地没有咨询师,怎么办?
如果简单心理在你们当地没有咨询师,建议您尝试选择其他城市的咨询师,进行视频咨询。
5. 如何进行视频咨询?
目前视频咨询主要通过两种方式进行,QQ或Skype。在预约成功后,您可以看到咨询师提供的具体方式。
...
首页feed流



碳酸钙 普通用户
12月20日测试内容测试内容测试内容删除碳酸钙 普通用户
12月20日测试内容测试内容测试内容删除碳酸钙 普通用户
12月20日测试内容测试内容测试内容删除