网页设计与制作第一讲_第1页
网页设计与制作第一讲_第2页
网页设计与制作第一讲_第3页
网页设计与制作第一讲_第4页
网页设计与制作第一讲_第5页
已阅读5页，还剩34页未读， 继续免费阅读

付费下载

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

网页设计与制作陈宏扬

课程考核

考核方式为考查，成绩为百分制。总评成绩为：平时70分+作业成绩30分，平时成绩主要根据、考勤、课堂测试等来考核。课前提问1、什么是WEB?2、什么是网页？3、什么是HTML？4、网页设计有哪些风格？5、你喜欢什么网站？6、你做过网页设计吗，如果有请具体说明.从WWW说起WWW是环球信息网（WorldWideWeb）的缩写,也可以简称为Web，中文名字为“万维网”。

对于普通的用户来说，web仅仅只是一种环境——互联网的使用环境、氛围、内容等；而对于网站制作、设计者来说，它是一系列技术的复合总称(包括网站的前台布局、后台程序、美工、数据库领域等等的技术概括性的总称)。什么是网站什么是网站网站是互联网上一块固定的面向全世界发布消息的地方。它由域名（即网站地址）和网站空间构成。可以将网站喻为一个摊位或地盘。如果一个企业上了互联网，表示进入了世界上最大的市场，此时也只不过是一个看客；而如果企业建立了自已的网站，它就在市场中拥有了一个“摊位”，可以宣传和展示自已产品。网站与网页的关系网站是网页、图片等文件的集合体，是网页通过超级链接的形式组成的。网站的逻辑结构

1．服务器部分——包括计算机硬件、操作系统、WWW程序、电子邮件程序等。

2．网络接入部分和网络安全系统——包括路由器、调制设备和网络安全系统。

3．数据存贮部分和中间件——数据存贮存系统要有海量存贮能力，高速搜索能力，有效的数据采集、制作和发布能力。中间件介于服务器系统数据存贮系统之间。

4．研发和维护部分——此部分贯穿于网站从建立到消亡的全过程，需要专人负责。网页设计网页设计是指使用标识语言（markuplanguage)，通过一系列设计、建模、和执行的过程将电子格式的信息通过互联网传输，最终以图形用户界面（GUI）的形式被用户所浏览。

网页设计基础网页（WEBPAGE）网页（英文：Webpage）是一个文件，他存放在世界某个角落的某一部计算机中，而这部计算机必须是与互联网相连的，通过网址（URL）来识别和存取。当我们在浏览器输入网址后，经过一段复杂而又快速的程序，网页文件会被传送到你的计算机，然后再通过浏览器解释网页的内容，再展示到你的眼前。网页要透过网页浏览器来阅读。HTTP

超文本传送协议，它是一种通信协议，它允许将超文本标记语言

(HTML)文档从Web服务器传送到Web浏览器。网页浏览器万维网(Web)服务的客户端浏览程序。可向万维网(Web)服务器发送各种请求，并对从服务器发来的超文本信息和各种多媒体数据格式进行解释、显示和播放。超文本标记语言htmlHTML是“HyperTextMark-upLanguage（超文本标记语言）”的缩写。HTML语言是由一系列元素组成，用于组织文件的内容和知道文件的输出格式。网页设计基础域名是由一串用点分隔的名字组成的Internet上某一台计算机或计算机组的名称，用于在数据传输时标识计算机的电子方位（有时也指地理位置），目前域名已经成为互联网的品牌、网上商标保护必备的产品之一。域名不仅便于记忆，而且即使在IP地址发生变化的情况下，通过改变解析对应关系，域名仍可保持不变。(中文域名：清华大学.cn)网页设计基础网页设计基础网页设计基础网页的一般结构网页设计基础网页的分类通常网页文件以htm、html、asp、aspx、PHP、JSP等为扩展名。不同的扩展名分别代表不同类型的网页文件。按表现形式可分为静态网页和动态网页。静态网页：指网页显示后（或显示期间），浏览器与服务器不再发生信息的交互。无法做进行查询、留言、聊天、电子商务等操作，并不是不动的网页，如/。动态网页:浏览器端和服务器端可以进行信息交流的网页，即服务器可以根据浏览者的请求做出相应动作和回复。常见的动态网页类型有ASP、ASPX、PHP和CGI等等，其中以ASP动态网页技术较成熟且易学。从站点的性质、任务的不同，网站又可以分为以下三类：1、资讯门户类网站，如新浪、搜狐等门户网站；2、资讯和形象相结合的网站，如大公司和国内高校的网站；3、形象类网站，如小型公司和个人的网站。（个性化）网页设计基础案例案例案例案例案例HTML的基本概念HTML文本是由HTML命令组成的描述性文本，HTML命令可以说明文字、图形、动画、声音、表格、链接等。HTML的结构包括头部（Head）、主体（Body）两大部分，其中头部描述浏览器所需的信息，而主体则包含所要说明的具体内容。

另外，HTML是网络的通用语言,一种简单、通用的全置标记语言。它允许网页制作人建立文本与图片相结合的复杂页面，这些页面可以被网上任何其他人浏览到，无论使用的是什么类型的电脑或浏览器。HTML只不过是组合成一个文本文件的一系列标签。HTML的基本使用HTML标签通常是英文词汇的全称（如块引用:blockquote）或缩略语（如“p”代表Paragragh），但它们的与一般文本有区别，因为它们放在单书名号里。故Paragragh标签是<p>,块引用标签是<blockquote>。有些标签说明页面如何被格式化（例如，<p>开始一个新段落），其他则说明这些词如何显示(<b>使文字变粗)还有一些其他标签提供在页面上不显示的信息－－例如标题。

关于标签，需要记住的是，它们是成双出现的。每当使用一个标签－－如<blockquote>,则必须以另一个标签</blockquote>将它关闭。基本HTML页面以<html>标签开始，以</html>结束。在它们之间，整个页面有两部分－－标题和正文。

标题词－－夹在<head>和</head>标签之间－－这个词语在打开页面时出现在屏幕底部最小化的窗口。正文则夹在<body>和</body>之间－－即所有页面的内容所在。页面上显示的任何东西都包含在这两个标签之中。1HTML简单易学。

浏览器读HTML就跟你读书一样，也是从上往下，从左到右进行的。所以，HTML文档的开始和结束便对应于网页的头和尾。如下所示：<html> <head> </head> <body> </body></html><p>用于段落</p><b>显示粗体文本</b><h1>标题</h1><h2>子标题</h2><h3>子子标题</h3>例1：该例在浏览器中将显示如下：这句话应显示为粗体。h1、h2、h3、h4、h5及h6元素的作用是显示标题（这里的h是“标题（heading）”的意思）。其中h1是一级标题，字体最大；h2是二级标题，字体比一级标题略小；而h6是六级标题，它是最后一级标题，字体也最小。例2：该例在浏览器中将显示如下：这是标题这是子标题<b>这句话应显示为粗体。</b><h1>这是标题</h1><h2>这是子标题</h2>23</html> <head> <title>我的网站</title> </head> <body> <h1>标题</h1> <p>一些文字。。。</p> <h2>子标题</h2> <p>一些文字。。。。</p> </body></html>4567有些元素是没有尾标签（endtag）的。这种元素被称作空元素（emptyelement），它们不与特定文本段落相关。一个例子是<br/>，它的作用是插入一个换行符。891011属性是什么？

HTML通过标签告诉浏览器如何展示网页（比如<br/>告诉浏览器显示一个换行）。你可以为某些元素附加一些信息，这些附加信息被称为属性（attribute）。1213背景颜色的设置14为什么上面那个页面全是红的？在上例中，我们将网页的背景颜色设置为“#ff0000”，这个十六进制代码（HEX）代表红色。每个颜色都有其对应的十六进制代码。下面是一些例子：白色：#ffffff

黑色：#000000

红色：#ff0000

兰色：#0000ff

绿色：#00ff00

黄色：#ffff001516哪些元素可以使用属性？不同元素使用不同的属性。有些元素（比如body等）被添加属性的机会比较大，而有些元素（比如br等）则较小、甚至不会被添加属性。HTML里有很多元素，同样也有很多属性。有些属性仅用于个别元素，有些属性可用于很多元素。反之亦然：有些元素只能使用个别属性，有些元素可以使用较多的属性。听起来这也许很令人困惑，不过一旦你熟悉了各个属性，就会感到很简单，并觉得它们很有用处。1718<b></b>粗体<I></I>斜体<U></u>下划线<BIG></BIG>大型字体<small></small>小型字体<blink>＜/blink>闪烁效果<em></em>强调斜体<strong></strong>特别强调粗体<cite></cite>

人人文库> 全部分类> 教育资料 > 课件下载

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论