Project Description

更新日期: 2017-11-01

在内容和内容之间做些区分,可能要用到这个Separator Element,比如下图所示:

tabs element设置界面

编辑界面

tabs element设置界面

设置选项

General

  • Style,分割线的样式,单横线(Single Border)、双横线(Double Border)这两种分别又有实线(Solid)、虚线(Dashed)、圆点线(Dotted);
  • Element Visibility,默认不修改,此选项和适配移动端有关系,可参考《设置移动端适配》
  • CSS Class / CSS ID,默认不需填写内容,需要针对此内容进行单独的样式调整时才考虑使用这2个选项;

Design

  • Separator Color,设置分割线颜色
  • Margin,设置分割线和上、下的间距大小
  • Border Size,设置分割线的粗细
  • Select Icon,设置分割线中是否显示一个icon,选择了合适的icon之后,会出现下面2个设置选项
    • Circled Icon,icon的圆形
    • Circle Color,icon圆形的颜色
  • Separator Width,设置分割线的宽度,若设置值填写的是百分比,则其宽度是根据其所在的Column的宽度来决定的,也可以填写一个固定的像素值来设置宽度
  • Alignment,对齐方式,只有当Separator Width设置了具体的值之后,这个才起作用

效果示意

50% width

100% width

Avada版本

适用:Avada5.2.2