网页设计理论与实务 课件全套 第1--8章 浏览器与网页基础---基于对象的JS编程.pptx

1-浏览器与网页基础;教学内容;一、浏览器的工作原理;1.1 网络基础;1.1 网络基础;1.2 TCP/IP协议;1.2 TCP/IP协议;1.3 IP地址与进制;1.3 IP地址与进制;1.3 IP地址与进制;1.3 IP地址与进制;1.4 课堂思政案例;1.4 课堂思政案例;1.5 域名与DNS;1.5 域名与DNS;1.6 URL;1.6 URL;1.7 常用浏览器;1.8 浏览器工作原理;1.8 浏览器工作原理;1.8 浏览器工作原理;1.9 网络原理应用;二、网站与网页;二、网站与网页;二、网站与网页;2.1 网页基础;2.2网页组成;2.2网页组成;2.2网页组成;2.2网页组成;2.3 网页制作流程;2.3 网页制作流程;2.3 网页制作流程;2.4 网页创建和测试;2.4 网页创建和测试;2.5 发布网页;三、网页设计辅助软件;3.1 编辑工具;3.1 编辑工具;3.2 网页测试工具;3.3 IDE;四、构建第一个网页;4.1 创建网页文件;4.2网页编码与文件存储;4.2网页编码与文件存储;4.3 测试网页效果;4.4 浏览器的渲染次序;4.4 浏览器的渲染次序;4.5 内存与物理存储;内容小结;随堂作业;2-网页文本处理;教学内容;一、结构标记;标记的作用;标记的作用;1.1 HTML标记;1.2 HEAD标记;1.3 META标记;1.3 META标记;1.3 META标记;1.4 课堂思政案例;1.5 网页的编码;1.5 网页的编码;1.5 网页的编码;1.6 BODY标记;1.7 结构标记代码及嵌套层次;1.7 结构标记代码及嵌套层次;1.8RGB与进制;1.9网页模版文件;二、文本样式标记;2.1 font标记;2.1 font标记;2.2 物理样式与逻辑样式;2.3 转义字符;三、组织段落;3.1 段落标记P;3.2DIV标记与SPAN标记;3.3嵌套标记间的包含关系;3.4 标题标记Hn;3.5BR标记与NOBR标记;3.6HR标记;3.7像素、分辨率与进制;3.8align属性;四、列表;UL示例;OL示例;四、列表;五、其他标记;内容小结;内容小结;随堂作业;随堂作业;3-常用网页标记;教学内容;一、文件路径;一、文件路径;一、文件路径;一、文件路径;课堂思政案例;二、链接;2.1 A标记;2.1 A标记;2.2 书签;2.2 书签;2.3BASE标记;三、网页图片;三、网页图片;3.1 图片类型;GIF;GIF;GIF;GIF;GIF;JPEG;不同压缩比的JPEG图片;JPEG;PNG;PNG;3.2 IMG标记;3.2 IMG标记;3.3 客户端图像映射;3.3 客户端图像映射;AREA标记符;AREA标记符;演示——图像映射效果;图像映射应用场景;如何确定坐标;3.4 MAP内重复区域处理;3.5 MARQUEE标记与滚;3.5 MARQUEE标记与滚;3.5 MARQUEE标记与滚;3.5 MARQUEE标记与滚;3.5 MARQUEE标记与滚;3.5 MARQUEE标记与滚;四、设计表格;4.1 table;4.2 tr;4.3 单元格标记;align和valign属性的;4.3 单元格标记;4.4基准线对齐;4.5 表格标题标记;4.6 合并行与列;4.6 合并行与列;4.6 合并行与列;五、网页表单与输入控件;5.1表单;5.2输入控件;5.2输入控件;5.2输入控件;5.2输入控件;5.2输入控件;5.2输入控件;5.2输入控件;内容小结;随堂作业;随堂作业;随堂作业;4--CSS基础;教学内容;一、CSS基础;1.1 CSS的作用;引入CSS后的代码;1.2 CSS语法;1.2 CSS语法;1.3 常用Selector类;（1）标记选择器;（1）标记选择器;（1）标记选择器;（2）自定义类;（3）自定义ID;类与ID示例;（4）伪类;1.4 定义CSS的位置;1.4 定义CSS的位置;在STYLE 标记内定义样式;1.4 定义CSS的位置;1.4 定义CSS的位置;应用场景？;1.5 引入CSS后的网页模版;1.6 样式的优先级;1.6 样式的优先级;1.6 样式的优先级;1.7 灵活的选择器;包含选择符;1.7 灵活的选择器;1.7 灵活的选择器;1.8 样式表的继承;1.8 样式表的继承;二、CSS基本单位;2.1 CSS长度单位;2.1 CSS长度单位;2.2 CSS颜色单位;三、设置字体相关样式;3.1设置显示字体;3.1设置显示字体;3.1设置显示字体;3.2设置字体大小;3.2设置字体大小;3.2设置字体大小;3.3设置字体样式;3.4 文字粗细;3.5 小型的大写字母;3.6 设置行高;3.7字体复合属性;四、设置文本样式;4.2 设置文字显示