网站构建培训课件(ppt 34页).ppt

1、01.10.2020,1,6.1.1网站建设概述,1. 网站策划准备阶段 2. 内容设计与实现阶段 3. 网站的发布与推广、维护阶段,01.10.2020,2,6.1.2 网站开发工具 （1/5）,静态网页 静态网页就是标准的HTML文件，其扩展名为.htm或.html，它可以包含HTML标记、文本、声音、图像、动画、Java程序以及客户端ActiveX控件，这种网页不包含任何脚本代码，在程序员开发好后不会自行改动。,01.10.2020,3,6.1.2 网站开发工具 （2/5）,客户端动态网页 客户端动态网页包含一些可在客户端浏览器中执行的脚本程序，这些程序可以在浏览器中被解释执行，这些脚本

2、可以根据用户的操作做出响应，实现这种动态效果的语言主要有JavaScript和VBScript。,01.10.2020,4,6.1.2 网站开发工具 （3/5）,客户端动态网页有很大的局限性。首先，其脚本程序是程序员在设计网页的时候事先写好的，响应的内容和方法有限；其次，这些脚本程序在客户端是可见的，减低了网站的安全性。为了改进客户端动态网页的问题，人们提出了服务器端动态网页。,01.10.2020,5,6.1.2 网站开发工具 （4/5）,服务器端动态网页 服务器端动态网页中也包含脚本程序，但是当网页被访问时，这些脚本程序首先在服务器端被解释执行，然后把执行的结果以一个新的纯HTML网页返回

3、客户端。在交互的过程中，客户端可以得到服务器处理的结果，但是源程序并不能在客户端看到，所以大大提高了网站的安全性。动态网页的文件扩展名不再是.htm或.html，而是与所使用的服务器端动态网页开发技术有关，例如，使用ASP.NET技术开发时，网页文件的扩展名是.aspx。,01.10.2020,6,6.1.2 网站开发工具 （5/5）,01.10.2020,7,6.3 Web语言HTML,HTML语言基础知识 HTML语言常用标记及属性,01.10.2020,8,6.3.1 HTML语言基础知识 （1/4）,HTML：Hyper Text Markup Language，即超文本标记语言，是一

4、种用来编写超文本文档的简单标记语言。用HTML编写的超文本文档称为HTML文档，它能独立于各种操作系统平台（如UNIX，WINDOWS等）。自1990年以来HTML就一直被用作WWW 的信息表示语言，用于描述网页的格式设计以及它与WWW上其它网页的连接信息。使用HTML语言描述的文件，需要通过WWW浏览器显示网页效果。 所谓超文本，就是因为它可以加入图片、声音、动画、影视等内容，并且可以从一个文件跳转到另一个文件，与世界各地主机的文件连接。,01.10.2020,9,6.3.1 HTML语言基础知识 （2/4）,1. HTML的基本结构,01.10.2020,10,6.3.1 HTML语言基础

5、知识 （3/4）,图6-23 一个简单的HTML示例,01.10.2020,11,6.3.1 HTML语言基础知识 （4/4）,2. 标签 单标签：这类标记的语法是： 最常用的：表示换行。 双标签：由“始标签”和“尾标签”两部分构成，必须成对使用： 内容 单标签和双标签的始标记内可以包含一些属性，其语法是： ,01.10.2020,12,6.3.2 HTML语言常用标记及属性（1/20）,1. 页面格式标记 1）段落标记 用来创建一个段落，中间可以加入文本，按段落文本显示在浏览器中。可使用align属性，说明段落的对齐方式，语法为： 文本内容 align可以是left/center/right

6、,01.10.2020,13,6.3.2 HTML语言常用标记及属性（2/20）,2）换行标记 如果加在的外边，将产生一个大的回车换行，在的里面，产生一个小的回车换行。,01.10.2020,14,6.3.2 HTML语言常用标记及属性（3/20）,3）列表标记 （1）、 创建普通列表 （2）、 用来创建标有数字的列表，用来创建一个标有圆点的列表。,01.10.2020,15,4）标题格式标记：共有6个标题标记对，是最大的标题，是最小的标题。,6.3.2 HTML语言常用标记及属性 （4/20）,01.10.2020,16,6.3.2 HTML语言常用标记及属性 （5/20）,2. 文本标记,

7、表6-2文本标记,01.10.2020,17,6.3.2 HTML语言常用标记及属性 （6/20）,3. 图像标记 1）图像属性赋值标记：在HTML文档中不是真正加入图像，而是加入图像的路径，路径可以是相对路径，也可以是绝对路径。 的属性根据路径的不同有不同的书写形式，如果使用相对路径，有下列几种情况： （1）如果HTML文件与图像文件（比如为logo.gif）在同一个文件夹下，则代码应为： （2）如果图像文件放在当前的HTML文档所在的文件夹的子文件夹中（比如images），则代码应为： ,01.10.2020,18,6.3.2 HTML语言常用标记及属性 （7/20）,（3）如果图像文件放

8、在当前的HTML文档所在的文件夹的上一层文件夹中（比如为files），则代码应为： 如果files是该网站下的home文件夹里的一个子文件夹，则代码应为 另外还有alt/border/width/height属性，alt是浏览时鼠标移动到图像上时显示的文本。 如果使用绝对路径，比如图像存放在E盘根目录下，代码应为： 2）水平线标记： noshade表示无阴影,01.10.2020,19,6.3.2 HTML语言常用标记及属性 （8/20）,4. 表格标记 1）创建表格标记 bgcolor表示背景色的属性 2）行、单元格和表格头标记 tr的属性值有align： td的属性值可以有width、co

9、lspan（单元格所跨行数）、rowspan（单元格所跨列数）： ,01.10.2020,20,6.3.2 HTML语言常用标记及属性 （9/20）,表6-3 行、单元格和表格头标记,01.10.2020,21,6.3.2 HTML语言常用标记及属性 （10/20）,5. 链接标记 1）创建链接页面标记 指向Internet上的网页文件链接：搜狐 指向本地网页文件的链接： 兴趣,01.10.2020,22,6.3.2 HTML语言常用标记及属性 （11/20）,指向电子邮件的链接： 与我联系 target属性： _blank：链接的网页以新窗口形式打开 _self：在本窗口打开 _parent

10、：在父窗口打开 _top：在整个浏览器窗口打开,01.10.2020,23,6.3.2 HTML语言常用标记及属性 （12/20）,2）创建链接标签标记 1 建立标签 1 建立指向标签的链接,01.10.2020,24,6.3.2 HTML语言常用标记及属性 （13/20）,6. 帧标记frame 用来向浏览器窗口中装载多个HTML文件，即每一个HTML文件占据一个帧，多个帧可以显示在同一个浏览器窗口中，帧也可以称为框架。 1）帧属性标记 在外边，可以嵌套使用,01.10.2020,25,6.3.2 HTML语言常用标记及属性 （14/20）,表6-4 常见的帧标记,01.10.2020,26

11、,6.3.2 HTML语言常用标记及属性 （15/20）,2）帧内容标记 （1）放在中间，用来定义某一个具体的帧，具有src、name、scrolling、noresize属性，src和name必须赋值，src是帧的源HTML文件名（包括相对路径或网址），name是帧的名字。 例如： strolling指定是否显示滚动轴，取值可以是“yes”、“no”或“auto” noresize直接加入，不需赋值，用来禁止用户在浏览器中调整一个帧的大小。 （2） 放在中，用来在那些不支持帧的浏览器中显示文本或图像信息。,01.10.2020,27,6.3.2 HTML语言常用标记及属性 （16/20）,7

12、.表单标记 1）创建表单标记 属性：action、method和target action的值是处理程序的程序名，如 method用来定义处理程序从表单中获取信息的方式，可取get或post。 2）定义输入区标记 例如创建一个单行文本输入框：,01.10.2020,28,6.3.2 HTML语言常用标记及属性 （17/20）,3）创建列表框标记 （1）定义下拉菜单或者是列表菜单 （2）指定列表框中的一个选项 4）创建文本框标记 创建一个多行的文本框，属性有name、cols和rows。,01.10.2020,29,6.3.2 HTML语言常用标记及属性 （18/20）,8. 多媒体标记 1）插入背景音乐 2）插入各种多媒体标记 用于插入各种多媒体，格式可以是MIDI、WAV、AIFF、AU等。 ,01.10.2020,30,6.3.2 HTML语言常用标记及属性 （19/20）,9. 其他标记 1） 走动的文字 例如： 滚动的文字 behavior属性：scroll/slide/alternate direction属性：left/right/up/down移动的方向 scrolldelay属性：移动的延时 scrollamount属性：移动的速度,01.10.2020,31,6.3.2 HTML语言常用标记及属性 （20/20）,2）放在之间