搜索
主编：潘明寒网页制作实例教程(第3版)——Dreamweaver基础（第1章）网页制作实例教程（第3版）1，网页设计基础知识2，DreamweaverCS4操作界面3，网页的HTML代码结构4，用可视化方法制作一个网页5，用HTML代码制作一个网页本章要点：网页制作实例教程（第3版）1.1.1网页网页从字面意思上来说就是网络上的页面，是通过浏览器显示信息的文档。一般情况下，网页由文本、表格、图像、超链接、表单、Flash动画等内容组成。网页分为静态网页和动态网页，它们之间的主要区别在于能否与服务器进行交互。静态网页是一个用HTML编写的文件，扩展名是html或htm。动态网页是能与服务器进行交互的网页，文件扩展名主要有三种：asp、jsp、php。1.1网页设计基础知识网页制作实例教程（第3版）1.1网页设计基础知识1，静态网页工作原理2，动态网页工作原理网页制作实例教程（第3版）1.1.2网站网站又被称为站点，是由主页和相关网页构成的超文本信息的集合，通常是一个文件夹，存放网站的所有资源和页面文件。站点分为本地站点和远端站点，存贮在本地机上的站点文件夹称为本地站点，存贮在因特网服务器上的站点文件夹称为远端站点。网站中一般包含一个主页和若干个子页，访问网站时默认打开的第一个网页称为主页，主页是站点的出发点和汇总点。1.1.3因特网因特网（Internet）是全球最大的、开放的、由众多网络互联而成的计算机网络。1.1网页设计基础知识网页制作实例教程（第3版）1.1.5HTTP协议TCP/IP称为“传输控制/网络协议”，是因特网所采用的标准协议。1.1.6称为“万维网”，由遍布全世界的Web服务器组成，是一个庞大的信息网，每一个存贮在服务器的网站都是中的一个节点。1.1.4TCP/IP协议HTTP协议称为“超文本传输协议”，是在因特网上传输超文本的协议。1.1.7URLURL称为“统一资源定位器”，是网上资源的存放地址。1.1网页设计基础知识网页制作实例教程（第3版）1.1.8FTP协议FTP称为“文件传输协议”，用来进行文件的上传和下载。1.1.10IP地址因特网中的每一台计算机有惟一地址，称为IP地址。IP地址由4组数字组成，数字之间用圆点隔开，每一组数字都在0到255之间。如：“202．102．96．44”就是一个主机服务器的IP地址。1.1.9服务器服务器是提供网络服务的计算机，Web服务器主要用于存贮Web站点和页面。本地机与服务器之间通过各种通信线路连接，以实现相互通信。1.1网页设计基础知识网页制作实例教程（第3版）1.1.11域名域名是主机地址的文字名称，域名是惟一的，一个域名对应一个IP地址。域名由26个英文字母、10个阿拉伯数字、减号和下划线组成，用圆点分隔成几节，字母不区分大小写。域名分级别，右边为最高级（也称为顶级），从右向左依次降低。1.1网页设计基础知识网页制作实例教程（第3版）1.1.12网站设计网站设计是指用HTML把多种媒体信息有效地组织起来，使浏览者高效、便捷地获取这些信息。网站设计主要包括两个方面：（1）信息的处理和组织，内容包括：文字排版、图片制作、平面设计、动画制作、影像制作等；（2）网站的延伸设计，内容包括：网站主题定位、浏览群定位、智能交互、制作策划、形象包装、宣传营销等。1.1网页设计基础知识网页制作实例教程（第3版）1.2.1DreamweaverCS4的特点（1）可视化编辑界面（4）跨平台、跨浏览器（2）强大的站点管理（5）具有集成性（3）灵活编写网页（6）媒体支持能力1.2DreamweaverCS4简介DreamweaverCS4由Adobe公司出品，是当今最流行的、功能强大的专业网页制作软件。网页制作实例教程（第3版）1.2DreamweaverCS4简介1.2.2DreamweaverCS4的起始页网页制作实例教程（第3版）1.2DreamweaverCS4简介1.2.3DreamweaverCS4的工作窗口网页制作实例教程（第3版）1.2DreamweaverCS4简介1.2.4DreamweaverCS4的菜单栏1.2.5“文件”工具栏网页制作实例教程（第3版）1.2DreamweaverCS4简介1.2.7状态栏1.2.6“插入”面板网页制作实例教程（第3版）1.2DreamweaverCS4简介1.2.8属性面板不同的网页元素，属性面板的内容也会不同。网页制作实例教程（第3版）1.2DreamweaverCS4简介1.2.9面板组网页制作实例教程（第3版）1.3设置页面属性1.3.1页面属性对话框“页面属性”对话框左边是“分类”列表，显示6个分类项：外观（CSS）、外观（HTML）、链接（CSS）、标题（CSS）、标题/编码、跟踪图像。对话框右边显示与分类项对应的设计内容。页面属性作用于整个网页，局部的特殊外观需要专门设置。网页制作实例教程（第3版）1.3设置页面属性1.3.2设置页面的“外观（CSS）”网页制作实例教程（第3版）1.3设置页面属性1.3.3设置页面的“外观（HTML）”网页制作实例教程（第3版）1.3设置页面属性1.3.4设置页面的“链接（CSS）”网页制作实例教程（第3版）1.3设置页面属性1.3.5设置页面的“标题（CSS）”网页制作实例教程（第3版）1.3设置页面属性1.3.6设置页面的“标题/编码”网页制作实例教程（第3版）1.4DreamweaverCS4的文件操作1.4.1新建文件网页制作实例教程（第3版）1.4DreamweaverCS4的文件操作1.4.2打开文件1.4.3保存文件1.4.4关闭文件网页制作实例教程（第3版）1.5创建第一个网页1，工作窗口网页制作实例教程（第3版）1.5创建第一个网页2，用浏览器预览网页制作实例教程（第3版）1.5创建第一个网页3，查看代码网页制作实例教程（第3版）1.6HTML简介1.6.1HTML概述HTML称为超文本标记语言，它用超链接把因特网里存放在不同计算机上的网站信息联系在一起，形成有机整体。HTML文件不需要编译，由浏览器解释执行。HTML是标记语言，不是程序语言，它的格式非常简单，只是由网页元素和HTML标记组成。标记用来分隔和标记文档中的各个网页元素，元素的显示方式以及元素在网页中的位置由标记属性规定。HTML文件是标准的ASCII文本文件，可以用任意一个文本编辑器打开和编辑，如Windows系统自带的“记事本”。用DreamweaverCS4可视化编辑的网页，系统会自动给出对应代码。HTML文件扩展名为“.htm”或者“.html”。网页制作实例教程（第3版）1.6HTML简介1.6.2HTML标记HTML标记放在“”和“”之间，“结束标记”带有“/”。说明：（1）标记名与“”之间不能有空格。（2）标记字母不区分大小写，建议都用小写。（3）标记分为单标记和双标记。·单标记，只有起始标记没有结束标记，如br或br/，后一种写法是xhtml代码书写的规范。·双标记，成对出现，如body和/body。（4）标记属性加在起始标记中，如fontsize=4color=red你好/font。网页制作实例教程（第3版）1.6HTML简介1.6.3HTML代码的书写规则（1）HTML代码中所有的符号都是半角符号，代码不区分大小写。（2）标记中的属性不分先后，属性之间用空格分隔，属性值可以写在双引号中，也可以不用引号直接书写。（3）标记不能交叉，但可以嵌套。（4）回车键和空格键在HTML源代码中不起作用。（5）HTML源代码的注释语句以“!--”开始，以“--”结束。网页制作实例教程（第3版）1.6HTML简介1.6.4HTML文件的基本结构网页制作实例教程（第3版）1.6HTML简介1.6.5用HTML代码建立网页htmlheadtitle用HTML制作网页/title/headbodysize=3这是我用HTML代码制作的网页brfontcolor=#FF0000size=4face=黑体这是我用HTML代码制作的网页/font/body/html网页制作实例教程（第3版）1.7上机实验1.7.1用可视化方法制作第一个网页网页制作实例教程（第3版）1.7上机实验1.7.2制作第一个HTML代码网页htmlheadtitle我的第1个HTML代码网页/title/headbodytext=redbgcolor=#FFFF99我们生活在网络时代/body/html网页制作实例教程（第3版）