也可以设置标识通用样式格式.PPTVIP

电子商务平台建设 第三单元 CSS样式表 一、DHTML基础知识 Dhtml：动态网页，将网页内容对象化，可用语言实现网页对象的可操作性，使网页可以与用户实现信息交互、内容更新等功能。 Dhtml技术包括javaScript、VBScript、CSS、Layers等技术。 Dhtml是基于HTML语言，通过CSS技术扩展了HTML样式定义语法和意义，使脚本程序调用或者控制游览器对象和网页对象，从而使页面具有动态效果。 任务一 网页中文字显示样式设置 子任务1：将demo3.htm另存为lx1.htm,后使用段落、文字属性设置，将网页demo.htm设置成/dspt/demo/demo4.htm的显示效果。 子任务2：使用段落、文字属性设置，将网页lx1.htm再设置成/dspt/demo/demo5.htm的显示效果。 注意：设置后观察lx1.htm文件的字节数。 总结使用HTML属性设置和修改网页存在的缺点。 二、CSS基础 1.CSS（层叠式样式表）是用于扩充HTML标识属性，增强网页显示样式控制的标记性语言； 2.CSS优点： 方便网页格式修改； 便于减少网页体积； 能使网页元素更准确定位； 使网页风格统一。 3.CSS特点： 内容与样式分开； 共享样式设定； 减少图片文件使用。 4.CSS使用类型 内联式样式：设置在标识中，对所在标识起作用； 嵌入式样式：设置在网页头部，对所在网页相应标识起作用； 外部样式文件：单独存放在样式表文件中，对使用样式表文件的网页起作用，应用于网站中网页风格的统一。 样式表文件的后缀名为.css 5.CSS样式类型 HTML标识样式：改变HTML标识默认显示样式，标识中不需说明； 通用样式：适用与使用该样式的所有HTML标识，样式设置时用#引导，标识中使用ID=“样式名”的形式说明。 子样式：与通用样式类似，适用与使用该样式的所有HTML标识，样式设置时用.引导，标识中使用calss=“样式名”的形式说明。 任务一 内联式样式设置 任务：设置标识的内联式样式，观看设置效果，并熟悉内联式样式代码位置与作用。 操作： 新建网页，输入“嘉兴职业技术学院”文字； 选中输入的问题，然后设置段落属性（见图） 进入代码页，查看段落设置后的代码，找到内联式样式代码段，熟悉相关属性。 三 内联式样式说明 内联式样式设置在body中的某一标识中，属性为“style”，值为样式设置。 Style的样式值中样式设置格式： 样式属性1：样式值1；样式属性2：样式值2；….. 内联式样式只对所在的HTML标识起作用，对其他同类标识不起作用； 内联式样式主要对所在标识的样式的补充设置，不具备CSS“方便网页格式修改”、“便于减少网页体积“的优点，应此不常用。 任务二 嵌入式样式使用 子任务1：标识样式设置 操作： 打开demo3.htm,另存为lx2.htm 打开lx2.htm,通过[格式]主菜单[样式]命令，对照demo4.htm样式，在网页头部设置H1、H2、H3、P标识的文字、段落样式表。 查看lx2.htm的显示效果。 查看lx2.htm代码，找出并熟悉嵌入式样式表的格式。 四 嵌入式样式说明 嵌入式样式表设置在网页头部，使用style/style标识； HTML标识的默认显示格式设置为： HTML标识{样式属性1：样式值1；样式属性2：样式值2…..} 在网页头部设置嵌入式样式表后，窗口中所有使用默认显示样式的相应HTML标识显示将会随样式表改变，但不改变含有内联式样式表的对应标识。 为了使同一标识显示不同的效果，可对标识设置子样式，格式： 标识.子样式1名称{样式属性1：样式值1；样式属性2：样式值2…..} 子样式的使用必须在标识中加class属性。 例： 子样式的设置可在选中内容的同时选择样式下拉框中相应的样式名即可。 也可以设置标识通用样式 格式: .子样式名称{样式属性1：样式值1；样式属性2：样式值2…..} 任务三 外部样式表的设计与使用 任务:通过外部样式表的设计与使用实现demo4.htm显示效果. 操作: 打开demo3.htm,另存为lx3.htm 使用FP新建一CSS文件 通过[格式]主菜单[样式]命令，对照demo4.htm样式，设置H1、H2、H3、P标识的文字、段落样式表。 查看生成的样式表文件代码 保存新建的样式表文件,文件名为mycss.css 打开lx3.htm,使用[格式]主菜单[样式表链接]命令,设置网页样式表链接到mycss.css 查看lx3.htm代码,找出样式表链接的语句 查看lx3.htm的显示效果 五 外部样式表说明 样式表文件后缀”.css”; 样式表文件也是纯文本文件,可用记事本等纯文本编辑工具编辑; 样式表文件只有被链接到网页