Dreamweaver CC 07章 掌握美化页面—CSS样式.pdfVIP

项目7 本本章章简简介介：： 层叠样式表 （CSS）是W3C组织批准 掌握美化页面 的一个辅助HTML设 的新特性，能保持 —CSS样式 整个HTML的统一外观。CSS的功能强大、 操作灵活，用CSS改变一个文件就可以改 变数百个文件的外观，而且个性化的表现 更能吸引访问者。 学习引导 知识目标 能力目标 情感目标 1、了解CSS样式的概 1、熟练掌握CSS 培养对网页美化的 念。 示的创建及应用。 兴趣。 学习目标 2、了解CSS样式的创 2、掌握CSS过渡效 建。 果面的使用方法。 1、制作山地车网页 实训项目 2、制作足球运动网页 任务7.1 制作山地车网页 ◆ 任务引入 ◆ 设计理念 ◆ 任务知识 ◆ 任务实施 ◆ 扩展实践 7.1.1 任务引入 山地自行车是一家以“低碳减排快乐骑行”为标语的生产 销售厂家，为消 费者提供全方面的自行车选购、比价、车架查询、在线咨询等服务。网页设计要 求体现出品牌特点 产品特色。 7.1.2　设计理念 在网页设计和制作过程中，使用实景照片作为底色，大幅的 景图片，使用 户看了心旷神怡，产生向往之情；左侧导航设计具有新意，使文字内容突出显示 让人一目了然；整体设计简单、大气，能够使人印象深刻。 效果图 7.1.3　任务知识：CSS设计器面板及样式 1．CSS样式的概念 CSS是Cascadin StyleSheet的缩写，一般译为 “层叠样式表”或 “级联样 式表”。CSS对HTML3.2之前版本的语法进行了变革，将某些HTML标签属性简 化。比如要将一段文字的大小变成36像素，在HTML3.2中要写成 “pfont size=36文字的大小/font/p”，标签的层层嵌套使HTML程序臃肿不 堪；而用CSS写成 “pstyle=font-size:36px文字的大小/p”即可。 CSS使用HTML格式的代码，浏览器处理起来速度比较快。可以说CSS是 HTML的一部分，它将对象引入HTML中，可以通过脚本程序调用和改变对象的 属性，从而产生动态效果。比如，当鼠标指针放到文字上时，文字的字号变大， 用CSS可写成：ponmouseover=className=aa动态文字/p。 7.1.3　任务知识：CSS设计器面板及样式 2．“CSS设计器”面板 使用 “CSS设计器”面板可以创建、 辑和删除CSS样式，并且可以将外部 样式表附加到文档中。 ◆ 打开 “CSS设计器”面板 ◆ CSS的功能 “CSS设计器”面板 7.1.3　任务知识：CSS设计器面板及样式 3．CSS样式的类型