如何编辑组件的样式（编辑样式）？

如何编辑组件的样式（编辑样式）？如何设置某一块内容的背景、边框、边距、文字样式？

编辑样式为组件通用功能，即几乎每个组件都是有“编辑样式”这个功能的。

一.如何进入组件的“编辑样式”功能？

把鼠标移到这块内容（这个组件）所在的区域上，在这个区域的左上角或右上角或左下角或右下角即四角区域，出现组件名称及一排操

作按钮，找到“编辑样式”图标 ，单击该图片即可进入组件的“编辑样式”功能。

二.什么是组件全局、标题栏、内容区？

点击“编辑样式”图标弹出编辑样式的弹出层，可分别对组件全局、标题栏、内容区进行样式编辑，当组件标题为空时，则不显示组件标

题，样式编辑器中就没有“标题栏”这个页签，同理如果组件内容区为空，则样式编辑器中没有“内容区”这个页签。点击该图标弹出编辑

样式的弹出层，可分别对组件全局、标题栏、内容区进行样式编辑，当组件标题为空时，则不显示组件标题，这里就没有“标题栏”这个页

签，同理如果组件内容区为空，则没有“内容区”这个页签。以文章分类组件为例做介绍：

1、组件全局  

组件全局页签下包含组件尺寸、组件背景、组件边框、组件边距。

如何调整组件的高度？手机端或Pad端出现内容被遮挡或留白情况，怎么办？

组件尺寸：可以设置组件的高度，一般清情况下都使用自适应的高度，若固定高度可能会导致不同终端下出现模块被遮挡、留白等情况，此

功能请谨慎使用（手机端或PAD端出现模块被遮挡或留白情况，请首先检查是否是设置了高度所致）；

如何给一块内容添加背景？如何给组件加背景？如何修改背景？

组件背景：可以给这个组件添加颜色背景或图片背景，也可以选择背景图片的平铺模式、平铺位置、背景尺寸，不同的选择可以有不同的展

示效果，可以分别点一下试一下哦。

如何给一块内容添加边框？如何给组件加边框？

组件边框：在这里可以设置组件边框的颜色、样式（实线、虚线、双实线、点）、边框的粗细、边框的圆角。

什么是组件内边距？什么是组件外边距？如何设置组件边距？

组件边距：在这里可以设置组件的内边距和外边距，内边距和外边距是如何定义的，请看下图。

设置边距时请考虑对手机端或pad端的影响，建议左右边距设置同样的距离最好不超过50px，上下也设置同样的距离，这个距离到pad或手

机是不会等比缩小的，如果边距设置的比较大，到手机上有效内容占的空间比较小，很不美观。

2、标题栏

如何设置组件的标题栏？如何设置组件标题栏文字的大小？

标题栏设置：可以单独对标题栏进行设置，可以选择显示或隐藏标题栏、可以设置标题栏的高度、背景、文字、边框、边距。如下图所示：

3、内容区

如何设置组件内容区的背景/文字/边框/边距？

可以给组件内容区添加颜色背景或图片背景、可以设置内容区非链接文字或带链接文字的字体/大小/间距/行高/对齐方式/字体样式等、可以

设置内容区的边框和内容区的边距。

设置好以上内容以后，若要同步到网站前台，需要点页面上的“发布”按钮才可以。

三.功能更新

1.样式编辑器中组件全局新增阴影效果；  （2017-9-30优化）

（1）新增功能应用场景：组件的样式编辑器中增加“阴影效果”设置，支持对阴影方向、颜色、偏移、拓展、虚化等方面进行设置；

（2）新增功能操作方法：

（3）新增功能应用效果：