CSS Helper类用于为主题元素分配一些特定的外观和行为。您可以将多个以空格分隔的CSS类,添加到同一个字段中。
全局类#
全局类可以应用于任何主题元素。通常他们在内容元素的“Extra class name”字段中使用:
Hidden
该类通过为其指定display:none !important CSS属性来完全隐藏所需元素。
vc_hidden-lg
vc_hidden-md
vc_hidden-sm
vc_hidden-xs
这些类通过为不同的屏幕宽度分配 display:none !important CSS属性来隐藏所需的元素:
- vc_hidden-lg – 屏幕宽度超过1120px
- vc_hidden-md – 屏幕宽度介于992和1199px之间
- vc_hidden-sm – 屏幕宽度介于768和991px之间
- vc_hidden-xs – 屏幕宽度低于767px
align_left
align_right
align_center
align_justify
这些类通过指定text-align CSS属性强制所需元素(及其内部元素)的文本对齐。
align_center_xs
此类仅在屏幕宽度低于768px时, 强制文本对齐到所需元素(及其内部元素)的中心。
text_thin
此类通过指定font -weight:300 CSS属性来更改所需元素(及其内部元素)的文本字体粗细。
text_bold
此类通过指定font -weight:700 CSS属性来更改所需元素(及其内部元素)的文本字体粗细。
highlight_primary
此类指定颜色, CSS属性将主要文本颜色, 应用于所需元素(及其内部元素),该值将取自Theme Options > Colors > Content colors > Primary color.
highlight_secondary
此类通过指定颜色 CSS属性将辅助文本颜色,应用于所需元素(及其内部元素),该值将取自Theme Options > Colors > Content colors > Secondary color.
highlight_faded
此类通过指定颜色 CSS属性将淡化文本颜色应用于所需元素(及其内部元素),该值将取自Theme Options > Colors > Content colors > Faded color.
highlight_white
此类通过指定颜色将白色文本颜色应用于所需元素(及其内部元素)color:#fff CSS属性。
highlight_black
此类通过指定颜色将黑色文本颜色应用于所需元素(及其内部元素)color:#000 CSS属性。
highlight_primary_bg
highlight_secondary_bg
highlight_faded_bg
highlight_dark_bg
highlight_light_bg
当您需要使用背景颜色突出显示某些文本时,这些类非常有用。这些类应用display:inline-block; Padding:0.5rem 1rem; CSS属性和相关颜色值。
行类#
行类可以通过“Extra class name”字段仅应用于Row元素(而不是Inner Row)。
reset-margins
当您使用“默认”列布局时,此类将列与背景对齐,请查看下面的示例:
默认设置:
使用“reset-margins”类:
remove_bg_xs
当屏幕宽度低于768px,此类隐藏行背景图像。