Spry框架是一个Javascript库,web设计人员可以使用它构建向嗄磅麇蚺站点访问者提供丰富体验的web页。spry框蕈瀵邻松架的标记非常简单且便于那些具有HTML、css和javascript基础知识的用户使用。那么下面就让我们一起看一下关于Spry构件的基础知识和基本操作吧。
工具/原料
Dreamweaver CS6
一、插入Spry菜单栏
1、新建一个HTML空白页
2、在菜单栏中选择‘插入’----‘布局对象’----‘spry菜单栏’,如下图:
![Dreamweaver CS6如何应用:[27]插入Spry构件](https://exp-picture.cdn.bcebos.com/4d3d2ab33c4133bae0f837ce6a37c97623bc2f0c.jpg)
3、在弹出的spry菜单中选择需要的样式,如下图:
![Dreamweaver CS6如何应用:[27]插入Spry构件](https://exp-picture.cdn.bcebos.com/23fd63c5cf672b5feeff31253314f4d0b403270c.jpg)
4、效果如下:
![Dreamweaver CS6如何应用:[27]插入Spry构件](https://exp-picture.cdn.bcebos.com/b955ead0b503c8d2074773fd498333bf3aef210c.jpg)
5、选中spry菜单栏,在’属性‘面板中输入相应参数
![Dreamweaver CS6如何应用:[27]插入Spry构件](https://exp-picture.cdn.bcebos.com/c3c22dbf3bef354f1701808d23db574afb321b0c.jpg)
6、可以修改项目名称和插入链接地址,举例如下:
![Dreamweaver CS6如何应用:[27]插入Spry构件](https://exp-picture.cdn.bcebos.com/b57fb6db574afa32df25184454b2dc19cf2c140c.jpg)
7、按F12预览效果如下:
![Dreamweaver CS6如何应用:[27]插入Spry构件](https://exp-picture.cdn.bcebos.com/2db6c1b2dc19ce2c0aa22a6d7fdca039121f110c.jpg)