dw选项卡代码_Dreamweaver 中的 Spry 选项卡 Tabbed Panels 自定义外观的一些细节

1、添加或者修改各个选项卡标签页中的文字

点击标题上的“小眼睛”可以切换到该面板和该面板的内容区

2、了解Spry选项卡对应的几个文件，方便自定义外观及设置，

注意一个站点默认指挥有一组这样的文件，如果要在不同页面自定义不同的外观，

需要手动修改这两个文件名，方法可以是在后面加数字，如SpryTabbedPanels1.css，SpryTabbedPanels2.js

同时去网页文件中头部修改为对应的两个文件名称。

对应的CSS 文件是在站点根目录SpryAssets文件里的SpryTabbedPanels.css

对应的 js 文件是在站点根目录SpryAssets文件里的SpryTabbedPanels.js

3、熟悉几个主要的类名

.TabbedPanels ：整个选项卡的定义类，修改width属性可以更改选项卡的宽度

.TabbedPanelsTab ：标签区域默认状态

.TabbedPanelsContentGroup ：内容面板

.TabbedPanelsContent ：内容区域

.TabbedPanelsTabHover：当鼠标指针移过面板选项卡上方时选项卡的状态

4、改变 Spry 选项卡式面板的切换方式

默认的“Spry 选项卡式面板”是经过鼠标点击后才切换到对应的面板，如果想要鼠标放到选项卡标签页上就可以自动切换到该选项卡内容则，可以改 SpryTabbedPanels.js 脚本程序 如果想要在鼠标移动到这个选项卡标签页时就显示出该选项卡标签页中的内容，可把 SpryTabbedPanels.js