网页设计与网站建设课件3(PPT).ppt

《网页设计与网站建设课件3(PPT).ppt》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、网页设计与网站建设第三部分高级应用目录固定宽度的圆角边框可变宽度、高度的艺术边框实线圆角边框Tab面板折叠面板3.1固定宽度的圆角边框图像的使用原则用尽可能少的图像用尽可能小的图像用尽可能简洁的html标记3.1固定宽度的圆角边框操作步骤设计图像设计html结构根据html结构对图像进行切片在html标记中添加背景图像3.2可变宽度、高度的艺术边框设计并制作艺术边框效果切成6片设计html结构，每一块中至少设计6个盒子采用“六图法”完成艺术边框的组合3.3单色实线圆角边框计算组成圆角的像素点设计“勾子”用css“描述”各关键像素点3.3单色实线圆角框编

2、号边框heigth左右margin1下1px0px7px2左、右2px1px5px3左、右1px1px4px4左、右1px1px3px5左、右1px1px2px6左、右1px2px1px3.4spry高级组件—tab面板Spry框架Spry框架是一个可用来构建更加丰富的Web页的JavaScript和CSS库。JavaScriptJavaScript是一种脚本语言。一种广泛用于客户端Web开发的脚本语言，常用来给HTML网页添加动态功能，比如响应用户的各种操作、统计点击量、显示当前日期和时间、滚动字幕等。CSS：定义spry框架的基本样式，

3、可以编辑创建步骤创建站点保存网页添加spry组件“全部保存”分析html结构整个面板放到一个名为“TabbedPanels1”的div中选项卡放到了一个ul中，每个选项卡对应一个li。内容放到一个div中，每个内容块又放入了一个div中。3.4spry高级组件—tab面板CSS选择器.TabbedPanels：设置整个选项卡面板的属性，如宽度、位置.TabbedPanelsTabGroup：设置“选项卡”的整体属性，如背景色.TabbedPanelsTab：设置每个选项卡的属性，如字体、填充等.TabbedPanelsContentGroup：定义选项

4、卡内容区的整体属性，如填充、边界等.TabbedPanelsContent：定义选项卡内容区的具体属性，如背景、边框3.4spry高级组件—tab面板3.5折叠式面板.Accordion：设置整个面板的属性，如宽度、位置.AccordionPanelTab：设置每个标签的属性，如字体、填充等.AccordionPanelOpen.AccordionPanelTab：定义展开菜单后，主菜单的样式.AccordionPanelContent：定义选项卡内容区的具体属性，如背景、边框.AccordionPanelTabHover：定义鼠标移入标签后的样式。