1-动态网页程序设计
合集下载
相关主题
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
使用Dreamweaver开发网站时需先建站点，然后再具体制作网页。
定义Dreamweaver站点（静态）
在本机硬盘中建个文件夹如：D盘根目录下建”myweb“
执行“站点/新建站点”菜单命令
输入站点名称及站点文件夹名称
将建网站所需的图片、音乐、动画等素材放入该文件夹内
第2章 HTML基础
课程要求及考核说明
参考教材1： 《细说PHP第三版》 高洛峰编著 课堂实践： 占总成绩的40%
期末考核： 课程设计与答辩占总成绩60%
考 勤： 固定座位，按空位查出勤
第1章 动态网页概述
Web的基本概念
Web的工作原理 网页开发技术和工具 定义Dreamweaver站点 HTML基础知识
Web的基本概念
网页
网页是Web服务器上的基本信息单位又称web页。它是一些使用不
同Web技术编写的文本文件，存放在特定的Web服务器的特定目录 下，使用浏览器可以浏览Web页。
主页
网站的第一个页面，一般将其保存为index或default文件。主页总是与一个 网 址（URL)相 对应，可引导用户进入一个网站。在设计与编写时必须给予 足够的重视。
用可视化软件编写
1、启动Dreamweaver程序 2、在设计视图、代码视图都可编写制作网页
W3School介绍
http://www.w3school.com.cn/
W3School是因特网上最大的WEB开发者资源，其中包括全面的教程、完善的参
考手册。
在 w3school，你可以找到你所需要的所有的网站建设教程 从基础的 HTML 到 CSS，乃至进阶的XML、SQL、JS、PHP
2、语法结构简单易于入门，且面向对象。具有很强的实用性。
3、支持广泛的数据 库如：MySQL、Access、SQLServer等。
要从事网站程序设计工作的相关课程
DIV+CSS JavaScript PHP Java语言 Ajax+XML J2EE C# 和 ASP.NET
<?php echo "<br />"; echo "服务器当前时间："; echo date('Y-m-d H:i:s',time()); ?>
PHP将信息解析 成代码发送到 客户端
PHP（Hypertext Preprocessor）
PHP是超文本预处理器的缩写，也是一种动态网站开发技术。是一种服 务器端、跨平台、HTML嵌入式的脚本语言。其独特的语法混合了C语 言、Java语言的特点，是一种被广泛应用的，开源的多用途脚本语言， 尤其适合Web开发。由于PHP的开源特点，PHP已成为主流的网站开发 技术。PHP进行web开发具有的优势： 1、占用系统资源少，速度快，成本低。
每次打开该网页显示的信息不是固定的，而是根据当时的时间自动变化
用户在地址栏中输入网址并提交，查找该网址对应的服务器。服务器接
受请求后，找到对应的网页文件执行程序处理，将结果生成静态网页返 回给客户端显示给用户。
客户端 服务器
发送请求
处理文件
返回内容
前台
后台
PHP工作流程
浏览器将HTML代 码解呈现出来
<Body>
<H1>这是H1显示的效果</H1> <H2>这是H2显示的效果</H2>
<H3>这是H3显示的效果</H3>
<H4>这是H4显示的效果</H4> <H5>这是H5显示的效果</H5>
<H6>这是H6显示的效果</H6>
</Body> </Html>
段落标记 <P>
段落标记<P>是HTML中最常见的一种符号，它位于各段落起始部位。 使用该标记后每块文本段落之间都会空出一行。
HTML的英文全称是HyperText Markup Language，中文含义即“
HTML代码
超文本标记语言”。它是一种简
单、通用的标记语言。通俗地说 HTML其实就是要控制网页上内
HTML代码
容的显示方式。
§2.1 HTML文档基本结构
HTML元素： 是构成HTML文件的基本单位 。
<HTML> <HEAD>
头部标记
通常包括标题<title>、头元素<meta>、脚本<script>、CSS样式<style>等。
这部分信息不会在浏览器窗口中显示。
标题: <title>……</title>,Web页面标题，64个字符以内。 头元素：<meta>,用于指定HTML文档的元信息和一些特殊属性。
Meta（单独使用）标记有三个属性：
标记：
由“<”和“>”括起来的具有特定含义的字符串 头部内容：定义了网页标题、关键字、CSS样式 等隐性内容，这些信息不会在浏览器内显示出来。 注释标记
头部信息
</HEAD> <BODY>
文档主体，正文部分
</BODY>
</HTML> “<!--” 与 “-->” 之间的内容将不在浏览器中显示。
从上面可以看出：HTML文档包括3个主要标记 文档标记<html>……</html> 头部标记<head>……</head> 主体部标记<body>……</body> 标记不区分大小写
网页制作工具
PHP开发工具EditPlus、Sublime 网页设计可视化工具Dreamweaver PHPEdit是一款windows下的脚本IDE(集成开发环境） ZendStudio是一款收费软件，功能强大的专业工具
建立站点
建立网站之前，先建立站点。站点是某个网站的本地或远程存储
位置，是存入网站所有网页及各种素材的文件夹。
客户端
发出请求
服务器端
HTTPRequest HTML
发回网页
静态网页
最初的都是用超文本标记语言HTML来实现的.
一般后缀为.htm或.html
制作工具可以是记事本、EditPlus等纯文本编写 工具，也可以是FrontPage、Dreamweaver等所见 即所得的工具。 静态网页的缺点是：如果要修改网页，必须修改
源代码，并重新上传。
每次打开该网页显示的信息都是静态不变的。不能和浏览者进行交互
静态网页的工作原理
发出请求
接受请求 找到静态网页 发送网页
Web服务器
客户端
发回网页
动态网页
所谓动态网页，就是服务器端可以根据客户端的不同请求
动态产生网页内容。 两个显著特点： 可以动态产生页面，动态显示数据 支持客户端和服务器端的交互功能
§ 2.2.2 文本格式化标记
− 在网页中，有时需要为文字设置粗体、斜体或下划线效果，这时就需要用到
HTML中的文本格式化标记，使文字以特殊的方式显示。 − 文本格式化常用标记
标记 <b></b>和<strong></strong> <i></i>和<em></em> <s></s>和<del></del> <u></u>和<ins></ins> 显示效果 文字以粗体方式显示（XHTML推荐使用strong） 文字以斜体方式显示（XHTML推荐使用em） 文字以加删除线方式显示（XHTML推荐使用del） 文字以加下划线方式显示（XHTML不赞成使用u）
客户端1 IE浏览器 客户端2 IE浏览器
服务器 FTP WWW E-mail
Internet
· · ·
客户端n IE浏览器
Web的工作原理
支持Web服务器的协议是HTTP协议，它支持在Internet上传 送超文本协议。 HTTP协议实现的过程可以分为以下4个步骤： 连接 客户端与指定的服务器建立连接 请求 由客户端提出请求并发送到服务器 响应 服务器收到客户端的请求后，取得相关对象并发送回客户端 关闭 在客户端接收完对象后关闭连接。
标记名与“<”、“>”间不能有空格。
HTML文件本身是一种文本文件，也是构成PHP网页的主要组成部分，可以使用 记事本或者EditPlus、可视化网页制作软件Dreamweaver来编写。
用简单的文档编辑器编写
1、 新建一个文本文档，输入HTML代码， 2、另存为一个文件名后辍为html或htm的文件 3、关闭文档，双击该文件即可在浏览器中看到网页的页面效果。
空格
在想要插入空格的地方直接输入“ ”代码。 输入多个连续的空格，在“编辑”菜单中，选中“首选参数”，选中 充许多个连续的空格前面的复选框。 如果不想使用“ ”，又希望保留连续空格，可以使用<pre>标签。 <pre>……</pre>，可定义预格式化的文本。
dom3.html
换行标记 <BR>
在编写HTML文件有时可能会希望内容另起一行，但新行与上一行之间 并不希望出现一行间距，即在逻辑上还属于一段。这种情况下就要使用 断行标记<BR>。 <Html> <Head><Title>断行标记</Title></Head> <Body> 故人西辞黄鹤楼，<Br/> 烟花三月下扬州。<Br/> 孤帆远影碧空尽，<Br/> 惟见长江天际流。 <Br/> </Body> </Html>
网站
存入在Web服务器上的多个网页，具有共同的主题，相似性质的互助资源称 为网站，网站总是由一个主页和若干从页组成。
URL地址
URL是Uniform Resource Locator的缩写，即统一资源定位系统。也就是 通常所说的网址。
域名
域名是Internet网络上的一个服务器或一个网络系统的名称。
§ 2.2.1 文本样式标记
− 多种多样的文字效果可以使网页变得更加绚丽，为此HTML提供了文本样式标 记<font>，用来控制网页中文本的字体、字号和颜色。其基本语法格式如下： <font 属性="属性值">文本内容</font> − <font>标记常用的属性:
属性名 face size color 含义 设置文字的字体，例如微软雅黑、黑体、宋体等 设置文字的大小，可以取1到7之间的整数值 设置文字的颜色
虚拟主机
把一台运行在互联网上的服务器划分为多个“虚拟”的服务器。每一个虚拟 主机都能够具有独立的域名和完整的Internet服务器功能。且各自独立， 由用户自行管理。但一台服务器主机上只能够支持一定数量的虚拟主机。
Web的工作原理
Web是基于IBiblioteka Baiduternet的服务，允许计算机之间的相互通信。 Web服务是指通过网页在客户机和服务器间传递信息的活动 Web的开发是基于客户端/服务器体系的。
从HTML2.0开始可以不加</P>做结尾，当遇见另一个<P>时，
前一个段落标记自动结束。 <Html> <Head><Title> 段落标记 </Title></Head> <Body>
<P> 物联网到底是什么?它能成为下一个经济热点吗?
<P> 物联网被称为继计算机、互联网之后，世界信息产业的第三次浪潮。 <P> 作为一个智能项目，· · · · · · 、振兴经济的重点领域。 </Body> </Html>
§ 2.2 HTML标记语法格式
每个HTML元素都有一些相关的属性，属性只出现在起始标记中，并且具有固定 的描述语法：<元素名 属性名1＝“属性值” 属性名2＝“属性值”……>
各属性之间无先后次序 。每一个HTML元素都有对应的起始标记和结束标记 ，
标题格式标记<Hn>
<Head><Title>标题格式的应用</Title></Head>
• • • HTTP-Equiv（绑定HTTP的响应元素） Name（声明版权） Content（为声明的版权赋一个值）
如：设置网页用于检索的关键字 <meta name=“keywords” Content=“This is my site”>
Http-equiv用来构造HTTP头信息，有expires、refresh和content-type 3个属性值，分别指明网页过期时间、网页刷新周期、文字编码方式。 如：<meta http-equiv=“expires” Content=“Sun,24 Aug 2020 08:30”> 表明文件在2020年8月24日8：30过期。 如：<meta http-equiv=“refresh” Content=“10”;URL=http://www. …> 表明网页每隔10秒自动刷新，自动跳转到某网站。 如：< meta http-equiv=“content-Type” Content=text/html; charset= gb2312”>表明该页面的文档类型为html文档，所用字符GB2312.
定义Dreamweaver站点（静态）
在本机硬盘中建个文件夹如：D盘根目录下建”myweb“
执行“站点/新建站点”菜单命令
输入站点名称及站点文件夹名称
将建网站所需的图片、音乐、动画等素材放入该文件夹内
第2章 HTML基础
课程要求及考核说明
参考教材1： 《细说PHP第三版》 高洛峰编著 课堂实践： 占总成绩的40%
期末考核： 课程设计与答辩占总成绩60%
考 勤： 固定座位，按空位查出勤
第1章 动态网页概述
Web的基本概念
Web的工作原理 网页开发技术和工具 定义Dreamweaver站点 HTML基础知识
Web的基本概念
网页
网页是Web服务器上的基本信息单位又称web页。它是一些使用不
同Web技术编写的文本文件，存放在特定的Web服务器的特定目录 下，使用浏览器可以浏览Web页。
主页
网站的第一个页面，一般将其保存为index或default文件。主页总是与一个 网 址（URL)相 对应，可引导用户进入一个网站。在设计与编写时必须给予 足够的重视。
用可视化软件编写
1、启动Dreamweaver程序 2、在设计视图、代码视图都可编写制作网页
W3School介绍
http://www.w3school.com.cn/
W3School是因特网上最大的WEB开发者资源，其中包括全面的教程、完善的参
考手册。
在 w3school，你可以找到你所需要的所有的网站建设教程 从基础的 HTML 到 CSS，乃至进阶的XML、SQL、JS、PHP
2、语法结构简单易于入门，且面向对象。具有很强的实用性。
3、支持广泛的数据 库如：MySQL、Access、SQLServer等。
要从事网站程序设计工作的相关课程
DIV+CSS JavaScript PHP Java语言 Ajax+XML J2EE C# 和 ASP.NET
<?php echo "<br />"; echo "服务器当前时间："; echo date('Y-m-d H:i:s',time()); ?>
PHP将信息解析 成代码发送到 客户端
PHP（Hypertext Preprocessor）
PHP是超文本预处理器的缩写，也是一种动态网站开发技术。是一种服 务器端、跨平台、HTML嵌入式的脚本语言。其独特的语法混合了C语 言、Java语言的特点，是一种被广泛应用的，开源的多用途脚本语言， 尤其适合Web开发。由于PHP的开源特点，PHP已成为主流的网站开发 技术。PHP进行web开发具有的优势： 1、占用系统资源少，速度快，成本低。
每次打开该网页显示的信息不是固定的，而是根据当时的时间自动变化
用户在地址栏中输入网址并提交，查找该网址对应的服务器。服务器接
受请求后，找到对应的网页文件执行程序处理，将结果生成静态网页返 回给客户端显示给用户。
客户端 服务器
发送请求
处理文件
返回内容
前台
后台
PHP工作流程
浏览器将HTML代 码解呈现出来
<Body>
<H1>这是H1显示的效果</H1> <H2>这是H2显示的效果</H2>
<H3>这是H3显示的效果</H3>
<H4>这是H4显示的效果</H4> <H5>这是H5显示的效果</H5>
<H6>这是H6显示的效果</H6>
</Body> </Html>
段落标记 <P>
段落标记<P>是HTML中最常见的一种符号，它位于各段落起始部位。 使用该标记后每块文本段落之间都会空出一行。
HTML的英文全称是HyperText Markup Language，中文含义即“
HTML代码
超文本标记语言”。它是一种简
单、通用的标记语言。通俗地说 HTML其实就是要控制网页上内
HTML代码
容的显示方式。
§2.1 HTML文档基本结构
HTML元素： 是构成HTML文件的基本单位 。
<HTML> <HEAD>
头部标记
通常包括标题<title>、头元素<meta>、脚本<script>、CSS样式<style>等。
这部分信息不会在浏览器窗口中显示。
标题: <title>……</title>,Web页面标题，64个字符以内。 头元素：<meta>,用于指定HTML文档的元信息和一些特殊属性。
Meta（单独使用）标记有三个属性：
标记：
由“<”和“>”括起来的具有特定含义的字符串 头部内容：定义了网页标题、关键字、CSS样式 等隐性内容，这些信息不会在浏览器内显示出来。 注释标记
头部信息
</HEAD> <BODY>
文档主体，正文部分
</BODY>
</HTML> “<!--” 与 “-->” 之间的内容将不在浏览器中显示。
从上面可以看出：HTML文档包括3个主要标记 文档标记<html>……</html> 头部标记<head>……</head> 主体部标记<body>……</body> 标记不区分大小写
网页制作工具
PHP开发工具EditPlus、Sublime 网页设计可视化工具Dreamweaver PHPEdit是一款windows下的脚本IDE(集成开发环境） ZendStudio是一款收费软件，功能强大的专业工具
建立站点
建立网站之前，先建立站点。站点是某个网站的本地或远程存储
位置，是存入网站所有网页及各种素材的文件夹。
客户端
发出请求
服务器端
HTTPRequest HTML
发回网页
静态网页
最初的都是用超文本标记语言HTML来实现的.
一般后缀为.htm或.html
制作工具可以是记事本、EditPlus等纯文本编写 工具，也可以是FrontPage、Dreamweaver等所见 即所得的工具。 静态网页的缺点是：如果要修改网页，必须修改
源代码，并重新上传。
每次打开该网页显示的信息都是静态不变的。不能和浏览者进行交互
静态网页的工作原理
发出请求
接受请求 找到静态网页 发送网页
Web服务器
客户端
发回网页
动态网页
所谓动态网页，就是服务器端可以根据客户端的不同请求
动态产生网页内容。 两个显著特点： 可以动态产生页面，动态显示数据 支持客户端和服务器端的交互功能
§ 2.2.2 文本格式化标记
− 在网页中，有时需要为文字设置粗体、斜体或下划线效果，这时就需要用到
HTML中的文本格式化标记，使文字以特殊的方式显示。 − 文本格式化常用标记
标记 <b></b>和<strong></strong> <i></i>和<em></em> <s></s>和<del></del> <u></u>和<ins></ins> 显示效果 文字以粗体方式显示（XHTML推荐使用strong） 文字以斜体方式显示（XHTML推荐使用em） 文字以加删除线方式显示（XHTML推荐使用del） 文字以加下划线方式显示（XHTML不赞成使用u）
客户端1 IE浏览器 客户端2 IE浏览器
服务器 FTP WWW E-mail
Internet
· · ·
客户端n IE浏览器
Web的工作原理
支持Web服务器的协议是HTTP协议，它支持在Internet上传 送超文本协议。 HTTP协议实现的过程可以分为以下4个步骤： 连接 客户端与指定的服务器建立连接 请求 由客户端提出请求并发送到服务器 响应 服务器收到客户端的请求后，取得相关对象并发送回客户端 关闭 在客户端接收完对象后关闭连接。
标记名与“<”、“>”间不能有空格。
HTML文件本身是一种文本文件，也是构成PHP网页的主要组成部分，可以使用 记事本或者EditPlus、可视化网页制作软件Dreamweaver来编写。
用简单的文档编辑器编写
1、 新建一个文本文档，输入HTML代码， 2、另存为一个文件名后辍为html或htm的文件 3、关闭文档，双击该文件即可在浏览器中看到网页的页面效果。
空格
在想要插入空格的地方直接输入“ ”代码。 输入多个连续的空格，在“编辑”菜单中，选中“首选参数”，选中 充许多个连续的空格前面的复选框。 如果不想使用“ ”，又希望保留连续空格，可以使用<pre>标签。 <pre>……</pre>，可定义预格式化的文本。
dom3.html
换行标记 <BR>
在编写HTML文件有时可能会希望内容另起一行，但新行与上一行之间 并不希望出现一行间距，即在逻辑上还属于一段。这种情况下就要使用 断行标记<BR>。 <Html> <Head><Title>断行标记</Title></Head> <Body> 故人西辞黄鹤楼，<Br/> 烟花三月下扬州。<Br/> 孤帆远影碧空尽，<Br/> 惟见长江天际流。 <Br/> </Body> </Html>
网站
存入在Web服务器上的多个网页，具有共同的主题，相似性质的互助资源称 为网站，网站总是由一个主页和若干从页组成。
URL地址
URL是Uniform Resource Locator的缩写，即统一资源定位系统。也就是 通常所说的网址。
域名
域名是Internet网络上的一个服务器或一个网络系统的名称。
§ 2.2.1 文本样式标记
− 多种多样的文字效果可以使网页变得更加绚丽，为此HTML提供了文本样式标 记<font>，用来控制网页中文本的字体、字号和颜色。其基本语法格式如下： <font 属性="属性值">文本内容</font> − <font>标记常用的属性:
属性名 face size color 含义 设置文字的字体，例如微软雅黑、黑体、宋体等 设置文字的大小，可以取1到7之间的整数值 设置文字的颜色
虚拟主机
把一台运行在互联网上的服务器划分为多个“虚拟”的服务器。每一个虚拟 主机都能够具有独立的域名和完整的Internet服务器功能。且各自独立， 由用户自行管理。但一台服务器主机上只能够支持一定数量的虚拟主机。
Web的工作原理
Web是基于IBiblioteka Baiduternet的服务，允许计算机之间的相互通信。 Web服务是指通过网页在客户机和服务器间传递信息的活动 Web的开发是基于客户端/服务器体系的。
从HTML2.0开始可以不加</P>做结尾，当遇见另一个<P>时，
前一个段落标记自动结束。 <Html> <Head><Title> 段落标记 </Title></Head> <Body>
<P> 物联网到底是什么?它能成为下一个经济热点吗?
<P> 物联网被称为继计算机、互联网之后，世界信息产业的第三次浪潮。 <P> 作为一个智能项目，· · · · · · 、振兴经济的重点领域。 </Body> </Html>
§ 2.2 HTML标记语法格式
每个HTML元素都有一些相关的属性，属性只出现在起始标记中，并且具有固定 的描述语法：<元素名 属性名1＝“属性值” 属性名2＝“属性值”……>
各属性之间无先后次序 。每一个HTML元素都有对应的起始标记和结束标记 ，
标题格式标记<Hn>
<Head><Title>标题格式的应用</Title></Head>
• • • HTTP-Equiv（绑定HTTP的响应元素） Name（声明版权） Content（为声明的版权赋一个值）
如：设置网页用于检索的关键字 <meta name=“keywords” Content=“This is my site”>
Http-equiv用来构造HTTP头信息，有expires、refresh和content-type 3个属性值，分别指明网页过期时间、网页刷新周期、文字编码方式。 如：<meta http-equiv=“expires” Content=“Sun,24 Aug 2020 08:30”> 表明文件在2020年8月24日8：30过期。 如：<meta http-equiv=“refresh” Content=“10”;URL=http://www. …> 表明网页每隔10秒自动刷新，自动跳转到某网站。 如：< meta http-equiv=“content-Type” Content=text/html; charset= gb2312”>表明该页面的文档类型为html文档，所用字符GB2312.