1网页设计概述

  1. 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
  2. 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
  3. 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。



1、实例:编辑生成一个HTML文件 第一步:启动记事本。 第二步:键入以下文本: <html> <head> <title>页面的标题</title> </head> <body> <p>这是我的第一个页面。<b>这是粗体文本。 </b></p> </body> </html> 第三步:将这个文件存为 "mypage.html"。



HTML 标签是用来标记 HTML 元素的。 HTML 标签被 < 和 > 符号包围。 这些包围的符号叫作尖括号。 HTML 标签是成对出现的。例如 <b> 和 </b>。 位于起始标签和终止标签之间的文本是元素的内容。 HTML 标签对大小写不敏感,<b> 和 <B> 的作用的 相同的。
网页设计的基本概念




2、浏览器 浏览器实际上就是用于浏览web网页的应用程序,其主要作用是显 示网页和解释脚本。对一般设计者而言,不需要知道有关浏览器实 现的技术细节,只要知道如何熟练掌握和使用它即可。用户只需要 操作鼠标,就可以得到来自世界各地的文档、图片或视频等信息。 用户只要在本地机上安装有WWW浏览器,就可以读取WWW服务 器上的信息了。 浏览器的种类 目前比较流行的WEB浏览器有:Internet Explorer(IE)、FireFox、 Opera、Safari、谷歌浏览器(google chrome)。
HTML文件的基本结构

如:



这就是一个 HTML 元素,这个 HTML 元素由起始标签 <b> 开始。 这个元素的内容是:“此文本是粗体的。”。 这个 HTML 元素由终止标签 </b> 结尾。 <b> 标签的作用是定义一个显示为粗体的 HTML 元素。 又如:也是一个 HTML 元素:

例子解释:




HTML文件的基本结构

2、HTML基本结构:
文档头 文档范围
文Baidu Nhomakorabea体
<html> <head> <title>文档标题</title> …… </head> <body> 文档正文 …… </body> </html>
文档标题
HTML文件的基本结构



HTML 文档是由 HTML 元素构成的文本文件。 HTML 元素是通过使用 HTML 标签进行定义的。 HTML 标签
HTML文件的基本结构

第四步:启动您的浏览器。在浏览器的文件菜单中选择“打开” 或者“打开页面”。找到您刚才创建的文件,选定它然后打开, 浏览器就会显示这个页面。 HTML 文件中的第一个标签是 <html>。这个标签告诉浏览器这 个 HTML 文件的开始点。文件中最后一个标签是 </html>。这 个标签告诉您的浏览器,这是 HTML 文件的结束点。 位于 <head> 标签和 </head> 标签之间的文本是头信息。头 信息不会显示在浏览器窗口中。 <title> 标签中的文本是文件的标题。标题会显示在浏览器的标 题栏。 <body> 标签中的文本是将被浏览器显示出来的文本。 <b> 和 </b> 标签中的文本将以粗体显示。
HTML文件的基本结构


注意事项: 标记的大小写问题: 在HTML标记的使用上,大小写没有区别,甚至 可以混合使用。如果您希望为使用下一代 HTML 而做好准备,您就应该使用小写标签。万维网 联盟 (W3C) 的标准是:建议在 HTML 4 中使用 小写标签,而在 XHTML(下一代 HTML)中, 必须使用小写标签。 HMTL文件的扩展名问题: 即可以使用 HTM 也可以使用 HTML 作为扩展名。 使用 .html 是相对安全的做法也是一个更好的习 惯。

<b>此文本是粗体的。</b>
<body>



也是一个 HTML 元素,这个 HTML 元素开始于 <body> 标签,结 束于 </body> 标签。 <body> 标签的作用是定义 HTML 文件中的容纳 body 的 HTML 元 素。
</body>
<p>这是我的第一个页面。</p> <b>此文本是粗体的。</b>


因HTML是一个文本文件,所以可以使用任合一个文 本编辑器进行编写。 也可用“所见即所得”的网页辅助生成工具来自动生 成,如常见的工具有Dreamwaver,FrontPage等。 HTML文件的浏览是在WEB浏览器上。浏览HTML文件 时,只需在浏览器地址栏上输入文件的URL即可。

浏览

HTML文件的基本结构
网页设计概述
主要内容: 网页设计的基本概念 网页技术概况 HTML简介
网页设计的基本概念



1、WWW WWW是World Wide Web的缩写,又称3W或 Web,中文译名为“万维网”。 WWW服务是因特网上应用最广泛的服务。 WWW使得一个站点可以设置一些Web页面,以 提供包括文字、图片、声音甚至影像的信息。 页面之间可以建立链接,通过链接,用户可以 在具有链接关系的页面之间进行切换。
网页设计的基本概念


4、统一的资源定位器URL URL是指取得Internet上文件资源的位置 与方式,对于网页而言,指WEB网页在 Internet上地址,浏览用户在浏览器的地 址栏处输入URL格式的内容,就可取得所 指的主机的相应网页。
网页设计的基本概念


5、网页和网站 网页是由HTML或者其他语言编写的,通过IE浏览器编译后供用户获取信息 的页面,它又称为Web页,其中可包含文字、图像、表格、动画和超级链 接等各种网页元素。网页一般可分为“静态页面”和“动态页面”。静态 页面是指网页文件中没有程序,而只有HTML代码,一般以.html或者.htm 为后缀名。动态网页就是指网页文件中不仅具有HTML标记,而且还含有程 序代码,并可通过数据库建立连接访问数据库或其它服务器资源,通常 以.asp、.aspx、.jsp、.php等为后缀名。其中,静态网页可浏览器可直接 浏览,而动态网页则要经网站所在的WEB服务器解释以后得到对应HTML代 码后才可浏览。 网站多个网页按照一定的结构组织在一起就构成一个网站。每个网站都有 一个名字为index或者default的Web页文件,一般称作主页或首页。主页是 用户访问一个网站看到的第一个页面,通常显示网站的主题和导航信息, 网站中的其它网页用来显示某一方面的详细内容,主页与其它网页通过链 接组织起来。网站位于提供网页浏览服务的WEB服务器上。
HTML简介

1、什么是 HTML



HTML 指超文本标签语言。 HTML 文件是包含一些标签的文本文件。 这些标签告诉 WEB 浏览器如何显示页面。 HTML 文件必须使用 htm 或者 html 作为文件 扩展名。 HTML 文件可以通过简单的文本编辑器来创建。
HTML简介


2、HTML的编辑和浏览 编辑
HTML文件的基本结构

HTML 标签的属性



HTML 标签拥有属性。属性为 HTML 元素提供附加信 息。 属性总是以名称/值对的形式出现,比如: name="value" 属性总是在 HTML 元素的开始标签中规定。 属性例子:

<body> 定义 HTML 文档的主体。 <body bgcolor=“yellow”> 拥有关于背景颜色的附加信息。 其中bgcolor=“yellow“定义<body> 的bgcolor的颜色属性为 黄色。
网页设计的基本概念

静态网页浏览:
浏览器
静态网页请求
网站服务器 直接响应

动态网页浏览:
返回静态网页
浏览器
动态网页请求
返回静态页面
网站服务器 响应 解释代码 生成静态页面
网页设计的基本概念

6、HTTP HTTP(HyperText Transfer Protocol,超文本传输协议)是在 Internet上传送超文本的协议,它是运行在TCP/IP集之上的应用协 议。它可以使浏览器更加高效,使网络传输量减小。任何服务器除 了包括供用户访问的HTML文件以外,还有一个HTTP驻留程序,用 于响应用户的请求。在打开一个网页时,浏览器是HTTP客户,向 服务器发送请求。当浏览器中输入一个HTTP的URL地址或单击一个 超链接时,浏览器就向服务器发送一个HTTP请求,此请求被送往 由IP地址指定的URL。服务器驻留程序接收到请求,在进行必要的 操作后回送所要求的HTML源文件,最后在客户端浏览器将HTML源 文件“翻译”成Web页面。简单地说,HTTP就是专门为WWW设计 的协议。
网页设计的基本概念


3、超文本及超链接 超文本(HyperText)技术是把一些信息根据需要链接 起来的一种信息管理技术,用户可以通过一个文本的链 接指针打开另一个相关的文本。只要单击页面中的超链 接(通常是带下划线的条目或图片),便可跳转到新的 页面或另一位置,获得相关的信息。 通常所说的网站或网页,就是由一个或多个超文本组成 的,而进入网站首先看到的那一页称为首页或主页 (HomePage)。通常由主页上的超链接引导用户跳转 到其他位置。网页的出色之处在于能够把超链接 (Hyperlink)嵌入网页中,这使用户能够从一个网页站 点方便地转移到另一个相关的网页站点。
相关文档
最新文档