网站构建培训课件

07.07.2019,1,6.1.1网站建设概述,1. 网站策划准备阶段 2. 内容设计与实现阶段 3. 网站的发布与推广、维护阶段,07.07.2019,2,6.1.2 网站开发工具 （1/5）,静态网页 静态网页就是标准的HTML文件，其扩展名为.htm或.html，它可以包含HTML标记、文本、声音、图像、动画、Java程序以及客户端ActiveX控件，这种网页不包含任何脚本代码，在程序员开发好后不会自行改动。,07.07.2019,3,6.1.2 网站开发工具 （2/5）,客户端动态网页 客户端动态网页包含一些可在客户端浏览器中执行的脚本程序，这些程序可以在浏览器中被解释执行，这些脚本可以根据用户的操作做出响应，实现这种动态效果的语言主要有JavaScript和VBScript。,07.07.2019,4,6.1.2 网站开发工具 （3/5）,客户端动态网页有很大的局限性。首先，其脚本程序是程序员在设计网页的时候事先写好的，响应的内容和方法有限；其次，这些脚本程序在客户端是可见的，减低了网站的安全性。为了改进客户端动态网页的问题，人们提出了服务器端动态网页。,07.07.2019,5,6.1.2 网站开发工具 （4/5）,服务器端动态网页 服务器端动态网页中也包含脚本程序，但是当网页被访问时，这些脚本程序首先在服务器端被解释执行，然后把执行的结果以一个新的纯HTML网页返回客户端。在交互的过程中，客户端可以得到服务器处理的结果，但是源程序并不能在客户端看到，所以大大提高了网站的安全性。动态网页的文件扩展名不再是.htm或.html，而是与所使用的服务器端动态网页开发技术有关，例如，使用ASP.NET技术开发时，网页文件的扩展名是.aspx。,07.07.2019,6,6.1.2 网站开发工具 （5/5）,07.07.2019,7,6.3 Web语言HTML,HTML语言基础知识 HTML语言常用标记及属性,07.07.2019,8,6.3.1 HTML语言基础知识 （1/4）,HTML：Hyper Text Markup Language，即超文本标记语言，是一种用来编写超文本文档的简单标记语言。用HTML编写的超文本文档称为HTML文档，它能独立于各种操作系统平台（如UNIX，WINDOWS等）。自1990年以来HTML就一直被用作WWW 的信息表示语言，用于描述网页的格式设计以及它与WWW上其它网页的连接信息。使用HTML语言描述的文件，需要通过WWW浏览器显示网页效果。 所谓超文本，就是因为它可以加入图片、声音、动画、影视等内容，并且可以从一个文件跳转到另一个文件，与世界各地主机的文件连接。,07.07.2019,9,6.3.1 HTML语言基础知识 （2/4）,1. HTML的基本结构,07.07.2019,10,6.3.1 HTML语言基础知识 （3/4）,图6-23 一个简单的HTML示例,07.07.2019,11,6.3.1 HTML语言基础知识 （4/4）,2. 标签 单标签：这类标记的语法是： 最常用的：表示换行。 双标签：由“始标签”和“尾标签”两部分构成，必须成对使用： 内容 单标签和双标签的始标记内可以包含一些属性，其语法是： ,07.07.2019,12,6.3.2 HTML语言常用标记及属性（1/20）,1. 页面格式标记 1）段落标记 用来创建一个段落，中间可以加入文本，按段落文本显示在浏览器中。可使用align属性，说明段落的对齐方式，语法为： 文本内容 align可以是left/center/right,07.07.2019,13,6.3.2 HTML语言常用标记及属性（2/20）,2）换行标记 如果加在的外边，将产生一个大的回车换行，在的里面，产生一个小的回车换行。,07.07.2019,14,6.3.2 HTML语言常用标记及属性（3/20）,3）列表标记 （1）、 创建普通列表 （2）、 用来创建标有数字的列表，用来创建一个标有圆点的列表。,07.07.2019,15,4）标题格式标记：共有6个标题标记对，是最大的标题，是最小的标题。,6.3.2 HTML语言常用标记及属性 （4/20）,07.07.2019,16,6.3.2 HTML语言常用标记及属性 （5/20）,2. 文本标记,表6-2文本标记,07.07.2019,17,6.3.2 HTML语言常用标记及属性 （6/20）,3. 图像标记 1）图像属性赋值标记：在HTML文档中不是真正加入图像，而是加入图像的路径，路径可以是相对路径，也可以是绝对路径。 的属性根据路径的不同有不同的书写形式，如果使用相对路径，有下列几种情况： （1）如果HTML文件与图像文件（比如为logo.gif）在同一个文件夹下，则代码应为： （2）如果图像文件放在当前的HTML文档所在的文件夹的子文件夹中（比如images），则代码应为： ,07.07.2019,18,6.3.2 HTML语言常用标记及属性 （7/20）,（3）如果图像文件放在当前的HTML文档所在的文件夹的上一层文件夹中（比如为files），则代码应为： 如果files是该网站下的home文件夹里的一个子文件夹，则代码应为 另外还有alt/border/width/height属性，alt是浏览时鼠标移动到图像上时显示的文本。 如果使用绝对路径，比如图像存放在E盘根目录下，代码应为： 2）水平线标记： noshade表示无阴影,07.07.2019,19,6.3.2 HTML语言常用标记及属性 （8/20）,4. 表格标记 1）创建表格标记 bgcolor表示背景色的属性 2）行、单元格和表格头标记 tr的属性值有align： td的属性值可以有width、colspan（单元格所跨行数）、rowspan（单元格所跨列数）： ,07.07.2019,20,6.3.2 HTML语言常用标记及属性 （9/20）,表6-3 行、单元格和表格头标记,07.07.2019,21,6.3.2 HTML语言常用标记及属性 （10/20）,5. 链接标记 1）创建链接页面标记 指向Internet上的网页文件链接：搜狐 指向本地网页文件的链接： 兴趣,07.07.2019,22,6.3.2 HTML语言常用标记及属性 （11/20）,指向电子邮件的链接： 与我联系 target属性： _blank：链接的网页以新窗口形式打开 _self：在本窗口打开 _parent：在父窗口打开 _top：在整个浏览器窗口打开,07.07.2019,23,6.3.2 HTML语言常用标记及属性 （12/20）,2）创建链接标签标记 1 建立标签 1 建立指向标签的链接,07.07.2019,24,6.3.2 HTML语言常用标记及属性 （13/20）,6. 帧标记frame 用来向浏览器窗口中装载多个HTML文件，即每一个HTML文件占据一个帧，多个帧可以显示在同一个浏览器窗口中，帧也可以称为框架。 1）帧属性标记 在外边，可以嵌套使用,07.07.2019,25,6.3.2 HTML语言常用标记及属性 （14/20）,表6-4 常见的帧标记,07.07.2019,26,6.3.2 HTML语言常用标记及属性 （15/20）,2）帧内容标记 （1）放在中间，用来定义某一个具体的帧，具有src、name、scrolling、noresize属性，src和name必须赋值，src是帧的源HTML文件名（包括相对路径或网址），name是帧的名字。 例如： strolling指定是否显示滚动轴，取值可以是“yes”、“no”或“auto” noresize直接加入，不需赋值，用来禁止用户在浏览器中调整一个帧的大小。 （2） 放在中，用来在那些不支持帧的浏览器中显示文本或图像信息。,07.07.2019,27,6.3.2 HTML语言常用标记及属性 （16/20）,7.表单标记 1）创建表单标记 属性：action、method和target action的值是处理程序的程序名，如 method用来定义处理程序从表单中获取信息的方式，可取get或post。 2）定义输入区标记 例如创建一个单行文本输入框：,07.07.2019,28,6.3.2 HTML语言常用标记及属性 （17/20）,3）创建列表框标记 （1）定义下拉菜单或者是列表菜单 （2）指定列表框中的一个选项 4）创建文本框标记 创建一个多行的文本框，属性有name、cols和rows。,07.07.2019,29,6.3.2 HTML语言常用标记及属性 （18/20）,8. 多媒体标记 1）插入背景音乐 2）插入各种多媒体标记 用于插入各种多媒体，格式可以是MIDI、WAV、AIFF、AU等。 ,07.07.2019,30,6.3.2 HTML语言常用标记及属性 （19/20）,9. 其他标记 1） 走动的文字 例如： 滚动的文字 behavior属性：scroll/slide/alternate direction属性：left/right/up/down移动的方向 scrolldelay属性：移动的延时 scrollamount属性：移动的速度,07.07.2019,31,6.3.2 HTML语言常用标记及属性 （20/20）,2）放在之间的标记 设定HTML文件以及其编码语系，中文网页使用gb2312编码。 表示该网页由什么编辑器生成,07.07.2019,32,第六章 思考题,1、建设企业网站一般需要哪些步骤？ 2、常用的网页制作工具有哪些？ 3、什么是HTML？什么是超文本？ 4、描述下面一段HTML代码在浏览器中所显示的内容。 HTML代码练习 姓名 成绩,07.07.2019,33, 高数 计算机 英语 李明 85 90 75 ,