Axure和Dreamweaver怎么做网页下拉菜单和步骤栏效果

Axure怎么做网页下拉菜单和百度经验左侧步骤栏效果

首先，咱们来说说怎么用Axure做出网页下拉菜单和像百度经验那样的左侧步骤栏吧！步骤超级简单，也很容易上手。

制作长页面布局
为了体现下拉菜单和步骤栏的效果，得先做个比较长（高）的页面。在Axure的工作区直接拖入4个矩形块，分别代表顶部标题、菜单栏、页面内容和底部。然后根据需求调整宽度和高度，这样基本页面布局就出来啦。
制作随页面滚动的标题
为了让效果更生动，给页面顶部的标题做个区别设置，比如固定其位置，这样用户滚动页面时，标题一直显示，体验杠杠的。
实现步骤栏效果
左侧步骤栏跟百度经验类似，就是几个步骤一排排排好，点击可以展开内容，给用户引导。可以给步骤栏设置交互，比如点击切换不同步骤，增加动态感。

怎么样，是不是挺有趣的？Axure真心是个好帮手，让你不用写代码也能做好互动效果！

说完Axure，我们再聊聊Dreamweaver咋做网站的下拉菜单，这可是网页设计中超基础但超重要的交互方式哦。

创建项目和HTML文件
打开Dreamweaver，点文件-新建，创建一个HTML文件。接着在页面内输入你想做导航栏的文字，然后选中文字，在下面属性栏里给链接赋值为#（空链接），别忘了保存文件。
调用行为面板设置下拉菜单
打开窗口-行为菜单，调出行为面板。选中你刚才输入的文字，点面板里的“+”，选择“显示弹出式菜单”，接着你得设定菜单内容及结构，这一步有点关键，菜单项目可以一层层添加，满方便哒。
插入表单菜单列表
还可以点插入-表单-列表菜单，手动添加下拉菜单选项。根据需要点击“+”添加菜单项，设置好名称，一眼就能预览效果，超级直观！
样式美化和交互效果升级
下拉菜单做好了，可以用CSS来美化，比如设置背景颜色、字体大小、颜色啥的，让菜单更有设计感。还能加个小箭头图标，点开更带感！如果你懂JS，写点简单脚本让菜单交互更顺滑，那简直棒极了。
预览和调试
完成以上步骤后，别忘了预览效果，看看菜单能不能正常弹出和关闭，运行过程中出点小毛病也不用急，改改样式或者交互就能搞定。