Divi Builder区域,行,列设置

几乎所有的可视化编辑器都分为区域,行,列这三层的形式来定义网站的布局,然后再在列中支持嵌套一层的列来更精细来划分。

divi Builder区域,行,列

上面的蓝色表示区域,或者也可以说是段落,区块。绿色表示行设置。对应的蓝色与绿色的”+"加号表示添加区域与行。灰黑色表示模块设置。不同的内容通过不同的模块来实现。

区域,行,列的相同模块设置

区域,行,列作为定位功能,很多功能都是一样的,他们是父子层级关系。区域里可以有很多个行,行里有多个列。

divi Builder区域,行,列的相同模块设置
divi Builder区域,行,列的相同模块设置

移动模块

模块左边第一个按钮,鼠标放在上面按住不放可以拖动此区域的位置。

模块设置

  • 内容
    链接:点击此模块跳转到的链接与打开方式。
    背景:通过自定义背景颜色、渐变、图像和视频来调整此元素的背景样式。支持电脑,平板,手机端分开设置,也支持鼠标悬停时的背景设置,最强大的是支持当前页批量扩展,重置其它相同位置背景设置。
    管理员标签:这将更改构建器中模块的标签,以便于识别。
  • 设计
    调整:设置此模块的宽度与高度。
    间距:设置此模块外部与内部的间距。
    边框:设置此模块边框的颜色,样式,圆角与阴影。
    过滤器:色调,饱和,亮度,对比度,反相,怀旧,不透明度,模糊,还支持混合模式,如果会PS的人可以玩玩,如果不会的人还是不要动的好,功能强大到怕你晕。
    变形:使用转换控件,可以使用缩放、平移、旋转和倾斜设置的组合对任何元素执行视觉调整。这使您无需单独的图形设计程序即可创建高级设计效果。
    动画:支持7种动画形式,动画方向,延时,持续时间,不透明度,速度线性与重复次数。
  • 高级
    CSS 类名:为元素分配任意数量的CSS类(用空格分隔),这些类可用于从子主题中或从Divi的自定义CSS输入中分配自定义CSS样式。
    CSSID:为元素分配一个唯一的css id,该元素可用于从子主题或从divi的自定义css输入中分配自定义css样式。
    自定义CSS:给此模块添加css样式,支持模块前,后与正文内容处插入。还支持电脑 ,平板与手机端分开区别插入。
    可见性:支持电脑,平板与手机端分别设置是否可见,支持设置水平与垂直方向溢出处理方式,支持Z-index的层叠顺序。
    过渡:过渡动画时间,延迟与速度线性控制。

复制模块

复制模块很多时间可以节省设计时间。

保存到库

可以将模块保存到库,在创建对应的模块时,可以选择从库中导入已经保存好的模块。如果保存为全局模块,那可以同步更新所有引用此模块的内容。

删除

模块化做网站就是比较快捷,删删改改是很正常的事。

其它设置

其它设置会把一些前面已经有的常用功能放置在此,方便操作。

区域,行,列模块的不同设置

虽然大部分的设置都相同,但必竟每个模块的功能不一样,定位也不一样,就有一些区别。

  • 区域设置 –》设计 –》布局
    显示内部阴影:在这里,您可以选择您的分区是否具有内部阴影。当您有彩色背景或背景图像时,这看起来很不错。
  • 行设置 –》内容 –》列结构
    在可视化编辑里也可以设置。
  • 行设置 –》设计 –》调整
    使用自定义排水沟宽度:启用此选项可定义此行的自定义装订线宽度。
    列高度相等:列高度相等将强制所有列假定行中最高列的高度。所有列的高度都相同,保持外观一致。
    宽:默认情况下,元素将扩展其父元素的整个宽度。如果要设置自定义静态宽度,可以使用此选项进行设置。
    最大宽度:设置最大宽度将防止元素超过定义的宽度值。最大宽度可与标准宽度设置结合使用。最大宽度取代正常宽度值。
    行对齐方式:行可以左对齐、右对齐或居中对齐。默认情况下,行在其父区域中居中。
  • 列内容设置
    不同的列里的模块内容不一样。

发表评论

电子邮件地址不会被公开。 必填项已用*标注

回到顶部

QQ群962782975