静态网页的制作PPT课件

1、。1，第1章，制作静态网页，2，1.1静态网页概述1.2动态网页概述1.3静态网页的工作过程1.4制作静态网页的工具，3，1.1静态网页概述。最初的网站都是由静态网页组成的，其中只包含文本、图形、图像等。用户只能被动地接受这些信息。当时，网页的核心是超文本标记语言，它易于编写，不需要特定的语言环境，可以由任何类型的编辑器编写，然后放入浏览器中观看结果。目前，有很多专门针对超文本标记语言的编辑软件，如首页、热狗、Dreamweaver等。最初的网络是完全静态的，只提供大量的信息服务，没有服务器端客户端的概念。“静态”意味着网站的内容是“固定的”。当用户的浏览器通过互联网的超文本传输协议请求网络服

2、务器提供网页内容时，服务器只将原来设计的静态超文本标记语言文档传输到用户的浏览器。它的页面内容使用标准的超文本标记语言代码和动态图片。动态网页概述所谓动态网页是指网页包含程序代码，后台数据库通过后台数据库与网络服务器之间的信息交互提供实时数据更新和数据查询服务。这类网页的后缀名称通常根据不同的编程语言而不同，如asp、jsp、php、perl、cgi等。动态网页可以根据不同的时间和不同的访问者显示不同的内容。静态网页和静态网页制作的工作过程可以概括如下：1 .网页素材的收集和制作(图像处理和动画制作)往往需要在网页中应用一些图像和动画，一方面是因为需要实际的内容，另一方面是为了增加网页的吸引力

3、。在万维网上，通常使用jpeg、GIF图片和flash动画。2.网页布局设计规划网页中各元素的位置关系和表达方式，合理安排图像、文本等元素，使网页布局合理、美观。3.文本写作需要在你自己的网页上有大量的书面材料，所以在fckeditor中使用HTML语言的标签是必要的。您也可以使用网页编辑工具的“所见即所得”功能直接编写文本。4.处理网页之间关系的主要方法是建立一个合理高效的网页导航系统。5.网页发布的主要目的是将构建好的网页上传到服务器供用户浏览。6.1.4制作静态网页的工具1。图像处理和动画工具：Photoshop、Flash等。2.网页编辑工具：1)纯文本编辑工具，如记事本；2)转换工具

4、，如word3)特殊工具，如FrontPage、Dreamweaver等。3.网页上传工具：1)文件传输协议工具，如万维网文件传输协议和电子文件传输协议；2)专用网页编辑软件的文件传输功能。4.网页优化工具：网页减肥茶、网页优化大师等。7，超文本标记语言的基本知识，2.1超文本标记语言简介2.2超文本标记语言的编写工具2.3超文本标记语言的编写格式2.4标签的结构特征2.5超文本标记语言文件的组成2.6文档标题标记2.7颜色表示方法，超文本标记语言是超文本标记语言的缩写，超文本标记语言是构成网页的主要工具，也是表示在线信息的符号标记语言。在互联网上，如果你想在世界各地发布和分发信息，你需要一种

5、能被广泛理解的语言，也就是说，一种所有计算机都能理解的母语。万维网使用的出版语言是超文本标记语言。通过超文本标记语言，需要表达的信息按照特定的规则被写入超文本标记语言文件，这些规则由一个特殊的浏览器识别，这些超文本标记语言被翻译成可识别的信息，即我们现在看到的网页。9，2.2超文本标记语言编写工具，用超文本标记语言编写的文件(文档)的扩展名是超文本标记语言或.超文本标记语言。它们是浏览器解释和浏览文件的格式。您可以使用编辑工具，如记事本和写字板来编写超文本标记语言文件。超文本标记语言使用标记对(标记)来写文件，这既简单又方便。它通常用来表示一个标签的开始和结束(比如标签对)，所以这样的标签对必

6、须在超文本标记语言文档中成对使用。今天，有很多工具可以制作网页。只需点击几下鼠标，就会出现一个精彩的网页。你想学超文本标记语言吗？答案是肯定的，因为工具就是工具，它们生成的代码是机械的，不够简洁，这降低了网页的打开速度。有许多新功能，工具无法生成。必须编辑代码。10，2.3 html格式。查看网页的源文件，我们可以看到HTML文件的格式如下：网页标题的省略号部分是网页的内容。事实上，每个标签都是一一对应的。每个网页文件都以。和之间的内容是网页的标题。将显示在浏览器的标题栏上。网页内容位于和之间。11，2.4标签1的结构特征。周围有。2.他们大多数成对出现。3.结束标记是/。4.标签已嵌入。5.

7、标签可以有多个属性和属性值。6.标签是西方语言的半角字符，不区分大小写。12，2.5超文本标记语言文件组成，标题和正文标记和普通文本，13、2.6文件标题标记，文件标题标记为。使用过浏览器的人可能会注意到浏览器窗口顶部蓝色部分显示的文本信息，这通常是网页的主题。在浏览器顶部显示网页主题非常简单，只需在标志对之间添加要显示的文本即可。14，2.7颜色表示方法，超文本标记语言使用#RRGGBB字符串来表示颜色，颜色变成RGB值。RGB值中的RR、GG和BB分别代表红色、绿色和蓝色这两个十六进制整数值。每种原色的值范围在00和FF之间(即十进制0和255)，也就是说，一个字节存储一种原色。每种原色有

8、256种颜色从浅到深的变化，网页中呈现的颜色都是由这三种原色混合而成的。Rgb值可以代表(256*256*256)颜色。15、HTML简单段落，这是第一段。这是第二段。这是第三段。在超文本标记语言中，p用来定义段落。16，写了几段，这段包含了源代码中的许多分支，但是浏览器忽略了这些分支。该段落在浏览器中包含许多空格，但浏览器会忽略多余的空格。您使用的浏览器窗口大小决定了段落的数量。如果您调整浏览器窗口的大小，段落的数量将相应地改变。17，段落中的换行符。若要在段落中换行，请使用标签br。18，6级标题设置，这是1号标题，这是2号标题，这是3号标题，这是5号标题，这是6号标题，19，标题的中心对

9、齐，这是标题上方的标题显示在中心。20，在段落中添加水平线，使用标签hr可以在HTML文件中添加水平线。村里的女人想象着宫殿里的生活：女王必须用一根金篙挑水。问：谁是世界上最穷的人？回答：炮兵连烹饪班的士兵！问：为什么？看着别人开枪，你要承担责任。一位初中数学老师谈到方程转换，在讲台上大声喊道：“同学们，注意！”我要变形了！21，以其他格式标记，b以粗体显示。斜体用I表示.芙蓉姐姐一词中的破折号表示删除。想唱就唱。在单词下面划线。X2在哪里？X2在哪里？努力学习，天天向上。这句话中的缩进表示调用getOrders是用来显示计算机代码的，代码中显示的字符是等宽字符。22，字体大小，字体大小此文本

10、的字体大小值是1。该文本的字体大小值为2。该文本的字体大小值为3。该文本的字体大小值为4。该文本的字体大小值为5。该文本的字体大小值为6。该文本的字体大小值为7。23，字体大小颜色，字体颜色此文本使用默认字体颜色。该文本的字体颜色为红色。该文本的字体颜色为灰色。该文本的字体颜色为绿色。下面第一段使用arial字体，第二段使用courier字体，第三段使用verdana字体。arial courier verdana arial courier verdana。25，列表标志，1。定义列表用于创建定义列表，定义列表用于创建列表中的上项目和列表中的下项目，两者都必须放在标志对之间。26，中国城市北

11、京上海广州美国城市华盛顿芝加哥纽约27，中国城市北京上海广州美国城市华盛顿芝加哥纽约28，思考，定义列表：野生动物各种动物生活在自然环境中没有人工繁殖。宠物指的是猫、狗和其他用于娱乐、陪伴、收养和繁殖的动物，也称为伴侣动物。29、2、有序列表和无序列表标志对用于创建有序列表；标记对用于创建无序列表；标志对只能在或标志对之间使用，用于创建列表项。中国城市北京上海广州美国城市华盛顿芝加哥纽约中国城市1北京2上海3广州美国城市华盛顿芝加哥纽约。31，无序列表：网站管理员学院网站管理员学院网页代码网站管理员学院魔兽世界的网页课程，32，创建一个超文本标记语言表，由。一个表可以分成许多行，这些行由；每行可以分成许多单元格，用。33，只有一行一列的表100，200，300，34，两行三列的表格100，200，300，400，500，600，35岁。带标题的表格：姓名，电话传真，比尔盖茨555 77 854 555 77 855垂直标题：姓名，比尔盖茨，电话555 77 854，传真55