浏览数量: 11 作者: 本站编辑 发布时间: 2018-06-26 来源: 本站
一、什么是占位符组件?
占位符组件是在页面上实现显示一块空白的模块,通过添加一块空白的高度或宽度来占位,实现模块与模块之间有一定高度或宽度的间距,而不是紧贴着连在一起,占位符在制作页面时的应用比较灵活(高度占位用的比较多,宽度占位用的比较少)。
二、占位符组件的应用场景主要有哪些?
占位符组件的应用很广泛,在制作页面时的应用也比较灵活。
比如:当一行中有多个列,每个列的内容高度不一样时,可以通过添加占位符组件来占位,达到排版上的美观性和一致性。再比如:两行内容(这两行使用两个不同的组件来实现的)之间的距离太近时需要使用占位符组件来占位以便更美观。
同时添加占位符组件,相比在组件中设置组件的上下边距,有一个额外的优势:占位符组件支持在不同设备上(PC端、Pad端、手机端)设置不同的高度,从而达到兼顾PC端、Pad端、手机端等多终端展示的效果。
占位符组件应用效果举例:通过占位符组件使得两部分内容间距变大。
三、如何使用占位符组件?
1、如何添加占位符组件?
在页面上添加组件的方法都是一样的,如何添加占位符组件?方法请参考此图文帮助如何添加组件?
添加的组件名称为“占位符”,如下图所示:
2、如何设置占位符在不同设备上的高度?
1)如何调整占位符在PC端的高度?
PC端占位符的高度,可以把鼠标放到占位符的下边缘线上下晃动找到下图所示标志,然后往上或往下拖动即可调整占位符的高度。PC端占位符的最小高度为10px,最大没有做限制。
2)如何设置占位符在PAD、手机端的高度?
第一步:把鼠标放到添加的占位符的位置,在占位符区域左上角会出现组件名称“占位符”,单击第一个按钮即“设置”,弹出“设置占位符 ”窗口;
第二步:在弹出的设置占位符窗口,可以滑动按钮调节占位符高度,也可以直接在后方矩形方框内输入数值来改变占位符高度。支持设置PAD横屏、PAD竖屏、手机横屏、手机竖屏上占位符的高度(高度区间0~100px),以便达到排版美观的效果。设置好之后单击“保存”;
3、如何设置占位符组件的背景颜色或背景图片?
通过占位符组件的编辑样式功能,可以给占位符组件设置背景颜色或设置背景图片,操作入口如下图所示:
第1步:把鼠标放到添加的占位符的位置,在占位符区域左上角会出现组件名称“占位符”,单击第二个按钮即“编辑样式”;
第二步:在“组件全局”页签下,单击“组件背景”--》自定义--》单击下拉小箭头设置需要的颜色,然后保存;
或:在“组件全局”页签下,单击“组件背景”--》自定义--》自定义,在图片下上传背景图片,然后选择平铺方式、平铺位置、背景尺寸,然后保存;
关于以上占位符的使用,都设置好以后,需要单击此占位符所在页面右上角的“保存”按钮,以便把占位符保存到后台,如果不保存,刷新页面,新添加的占位符不存在。如果需要访客看到此占位符时,再请单击此页面右上角的“发布”按钮:
【功能升级】2022年1月第2周:新增“尼泊尔语”小语种建站功能|新增移动端“行背景”设置功能|邮件订阅表单新增人机校验功能
【功能升级】2022年1月第4周:网站编辑器新增“页面行模块宽度自定义”功能 | 产品详情组件新增文件下载功能|产品详情组件新增规格参数功能
【功能升级】2021年12月第5周:领动云平台新增“在线生成产品图册”功能|LeadongShop优化应用市场展示|“产品列表”组件新增“开启Google结构化
【功能升级】2021年12月第2周:“相关产品”组件支持循环滚动|新订单系统支持展示更多订单详情信息|移动端页头支持调用全站搜索功能
【功能升级】2021年10月第2周:支付系统2.0支持Wise|产品列表组件新增风格13 | 营销弹窗及公告栏支持移动端设置背景
【功能升级】2022年1月第1周:评价系统新增“隐藏评价人”功能|评价系统新增“真实评价认证”功能|内容管理后台新增“后台语言”切换功能