在本教程中,你将学习如何制作一个适应浏览器窗口宽度的图片或色条。【原型预览】
1、元件设置
- 打开一个新的RP文件,双击页面面板下的Page 1将其在画布中打开。
- 从元件库中拖拽一个动态面板元件到画布中。
- 在样式面板下,勾选100%宽度(仅浏览器中有效)。
2、用颜色或图片填充动态面板
使用样式面板下的填充选项来设置动态面板的背景:
- 点击颜色选项并在颜色选择器中选择一种颜色,可以为动态面板设置颜色背景。
- 点击图片选项并在电脑中选择一张图片,可以为动态面板设置图片背景。
注意:在下拉列表中将图片设置为拉伸,以保证它可以填满动态面板的整个宽度。
3、预览页面
- 预览页面,图片将会填满浏览器窗口的整个宽度。
- 尝试调整浏览器窗口的大小,你会注意到图片也会自动适应窗口宽度。
其他信息和提示
全屏宽的轮播图
要实现全屏款的轮播图,将本教程的方法和轮播图教程的方法结合起来就可以。给动态面板的每个状态设置不同的背景图片,然后使用轮播图教程的方法使图片轮流播放。