网页制作基础知识

考核方式考勤10%+平时成绩30%+期末成绩70%（考查）平时请假不得超过三次，确需请假的，必须见有班主任签字的请假条欣赏DreamweaverCS5网页第1章网页与网站基础知识授课老师：吴章洪本章内容1.1认识网页和网站1.2网页的相关概念1.3网页的基本构成元素1.4网页的技术构成1.5网页的HTML构成1.6HTML常用标记1.1认识网页和网站1.1.1什么是网页1.1.2什么是网站1.1.1什么是网页网页概念是Internet中最基本的信息单位，是把各种多媒体信息相互链接起来而构成的一种信息表达方式。网站首页和主页在访问一个网站时，首先看到的网页一般称为该网站的首页。主页设有网站的导航栏，是所有网页的链接中心。多数网站的首页与主页通常合为了一个页面1.1.2什么是网站网站就是在Internet上通过超级链接的形式构成的相关网页的集合。按照内容形式的不同，网站可以分为:1.门户网站2.职能网站3.专业网站4.个人网站1.2网页的相关概念1.2.1浏览器1.2.2网页与HTML1.2.3URL、域名与IP地址1.2.4网站上传和下载1.2.1浏览器浏览器是指将互联网上的文本文档（或其他类型的文件）翻译成网页，并让用户与这些文件交互的一种软件工具，主要用于查看网页的内容。互联网（Internet）又称为因特网，是一个把分布于世界各地的计算机用传输介质互相连接起来的网络。Internet主要提供的服务有万维网（）、文件传输协议（FTP）、电子邮件（E-mail）及远程登录（Telnet）等。1.2.2网页与HTMLHTML（HyperTextMarkedLanguage）即超文本标记语言，是一种用来制作超文本文档的简单标记语言，也是制作网页的最基本的语言，它可以直接由浏览器执行。1.2.3URL、域名与IP地址URL也就是网络地址，是在Internet上用来描述信息资源，并将Internet提供的服务统一编址的系统。域名类似于Internet上的门牌号，相对于IP地址而言，更便于使用者理解和记忆。IP地址是给因特网上的每台计算机和其他设备分配的一个唯一的地址。在IE浏览器的地址栏中输入IP地址“202.38.64.9”，按下回车键。1.2.4网站上传和下载上传（Upload）是从本地计算机（一般称客户端）向远程服务器（一般称服务器端）传送数据的行为。下载（Download）是从远程服务器取回数据到本地计算机的过程。1.3网页的基本构成元素网页设计教程网页是全球广域网的基本文档，网页可以是站点的一部分，也可以独立存在。网页是由一些基本元素组成的，下面就来介绍这些元素。文本：网页中的信息主要是以文本为主。图像：图像的主要作用是丰富网页。超链接：网页的灵魂，从一个网页指向另一个目的端的链接。表格：表格是WEB2.0时代以前中，网页排版的灵魂。表单：表单是用来收集站点访问者信息的域集。动画：吸引用户的视觉最有效的手段。框架：框架是网页的一种组织形式。1.4网页的技术构成网页设计教程1.4.1HTML网页的产生是设计和技术的结合。从技术上来划分，分为如下几种。HTML超文本标记语言（英文：HypertextMarkupLanguage，HTML）是为“网页创建和其它可在网页浏览器中看到的信息”设计的一种标记语言。HTML被用来结构化信息——例如标题、段落和列表等等，也可用来在一定程度上描述文档的外观和语义。1982年由蒂姆·伯纳斯-李创建，由IETF用简化的SGML（标准通用标记语言）语法进行进一步发展的HTML，后来成为国际标准，由万维网联盟（W3C）维护。——Google维基百科（本课程所有的核心内容都将围绕着HTML标记展开！）网页设计教程网页的产生是设计和技术的结合。从技术上来划分，分为如下几种。CSS层叠样式表（英语：CascadingStyleSheets，简写CSS），又称串样式列表，由W3C定义和维护的标准，一种用来为结构化文档（如HTML文档或XML应用）添加样式（字体、间距等）的计算机语言。目前最新版本是CSS2.1，为W3C的候选推荐标准。CSS3现在已被大部分现代浏览器支持，而下一版的CSS4仍在开发过程中。——Google维基百科（本课程中的另一个核心是围绕着CSS展开！）1.4.2、CSS网页设计教程1.4.3、JAVASCRIPT网页的产生是设计和技术的结合。JAVASCRIPTJavaScript是一种广泛用於客户端网页的腳本語言，最常是於HTML上使用，用来给HTML网页添加动态功能。然而JavaScript也被用於不同的介面上，如服务器。它最初由网景公司的BrendanEich设计，是一种动态、弱类型、基于原型的语言，内置支持类別。JavaScript是甲骨文公司的注册商标。Ecma国际以JavaScript为基础制定了ECMAScript标准。JavaScript也可以用于其他场合，如服务器端编程。完整的JavaScript实现包含三个部分：ECMAScript，文档对象模型，浏览器对象模型。——Google维基百科网页设计教程1.4.4、PHP网页的产生是设计和技术的结合。PHPPHP（PHP：HypertextPreprocessor）是一种在电脑上运行的脚本语言，主要用途是在于处理动态网页，也包含了命令行运行接口（commandlineinterface），或者产生图形用户界面（GUI）程序。PHP的应用范围相当广泛，尤其是在网页程序的开发上。一般来说PHP大多运行在网页服务器上，通过运行PHP代码来产生用户浏览的网页。PHP可以在多数的服务器和操作系统上运行，而且使用PHP完全是免费的。根据2007年4月的统计数据，PHP已经被安装在超过2000万个站点和100万台服务器上。——Google维基百科（本课程中不会涉及到动态网页的部分！）1.5网页的HTML构成1.5.1文档标记1.5.2头部标记1.5.3主体标记1.5.1文档标记文档标记的语法格式如下。HTML............................................/HTML1.5.2头部标记头部标记（HEAD…/HEAD）包含文档的标题信息，头部标记都不可或缺，但是其起始和结尾标记可省。1.5.3主体标记主体标记（BODY…/BODY）包含了文档的内容，用若干个属性来规定文档中显示的背景和颜色。为该标记添加属性的代码格式如下。BODYBACKGROUNE=”URI“BGCOLOR=”Color“............................................/BODY1.6HTML常用标记1.6.1链接标记LINK1.6.2段落标记P1.6.3通用块标记DIV1.6.4行内标记SPAN1.6.5元数据标记META1.6.6图像标记IMG1.6.7框架容器标记FRAMESET1.6.8子框架标记FRAME1.6.9表格标记TABLE1.6.10浮动帧标记IFRAME1.6.11滚动标记marquee1.6.1链接标记LINK链接标记LINK定义了文档的关联，在头部标记中可包含任意数量的LINK。LINKREL=GlossaryHREF=”a1.html”表示“a1.html”是当前文档的词汇表。LINKREV=SubsectionHREF=”a2.html”表示当前文档是“a1.html”的词汇表。1.6.2段落标记PP…/P定义了一个段的块级标记，所使用的属性是“ID”属性和“LANG”属性。1.“ID”属性PID=F1MyfirstParagraph./PPID=F2MysecondParagraph./P2.“LANG”属性PLANG=enThisparagraphisinEnglish./P1.6.6图像标记IMGIMG行内标记定义了一个行内图像，使用格式如下所示。imgsrc=lotus.jpgalt=莲花之美border=10width=600height=300align=left1.6.8子框架标记FRAMEFRAME定义了一个框架设置文档中的子区域，包含在定义了框架尺寸的FRAMESET…/FRAMESET中。1.6.9表格标记TABLETABLE…/TABLE标记用来定义表格，一般处于BODY标记中。简单的HTML表格由table标记以及一个或多个tr、th或td标记组成。