Hello官网组件常用设置介绍


 

Hello官网自助建站平台,作为一款拖拽式、所见即所得的网页设计系统,组件是组成页面的基础元素,合理设置组件的属性,将会使您的网站更加精美。下面以按钮组件为例介绍一些常见的组件设置。


样式设置


图标


图标属性是在组件上呈现一个选定图标的功能,如下图:




打开组件的属性面板,如果属性里包含“图标”设置,点击下拉箭头,出现图标列表,选择一个图标后,组件上将会出现您所选择的图标。



文字


文字样式设置是用来改变组件上的文字外观的,包含字体、文字颜色、文字大小、文字样式和对齐方式五种设置,如下图:


字体:字体目前支持宋体、微软雅黑和Arial三种。


3.png


颜色:颜色有两种设置方式,您可以点击颜色小方块,弹出如图所示的颜色选择界面,选择您需要的颜色;如果您知道需要的颜色的RGB代码,也可直接在颜色方块后输入对应的RGB值完成颜色更改(例如输入“#FF0000”则为红色)。如果您需要清除颜色设置,可打开颜色选择器点击右上角的 “×”按钮,或者直接清空RGB值。



大小:改变字体大小的设置,支持的值范围为12~32。

样式:改变字体样式。加粗、斜体、下划线。

对齐:文字在组件上所处位置。靠左、居中、靠右三种。



背景


背景设置是用来改变组件整体背景的设置。支持纯色背景、渐变色背景、图片背景以及清空背景的设置。

纯色背景的设置同文字颜色的设置。

渐变色背景需要您设置两个不同的颜色,便会得到如下图所示的渐变色背景效果:



图片背景则是使用一张图片作为整个组件的背景,具体设置方式如下:

选择“图片”标签,点击下图所示的红框处,弹出图片选择界面,选择您需要的图片后,点击“确定”按钮完成选择。如果图库里没有您需要的图片,您也可也浏览“资源库”或者自己“上传资源”。选好图片之后,可通过图片下方的“位置”和“平铺”调整图片显示。特别说明:三种背景设置如果都设置了值,只会有一种生效,优先级是渐变色>图片>纯色。例如您同时设置了图片和渐变色背景,想要图片背景生效则需要清除渐变色的设置。




边框


边框设置为组件整个外边框的设置,支持批量设置和单条边框设置。点击“批量设置”前面的锁,变为锁定状态时,只需要改变上边框的属性值,即可完成四条边的相同设置。设置可改变边框的颜色、线型、线宽。线宽值最大为20。解除批量设置的锁定状态以后,可以对四条边框做单独设置。边框的圆角值设置最大支持20。



阴影


阴影设置可设置控件阴影的X轴Y周值,以及阴影模糊值,三种值支持的范围均为0~20。您还可以设置阴影的位置和颜色。阴影的效果请看下图: