1网页设计概述 - 360文档中心

合集下载

相关主题

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

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

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

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

如：

这就是一个 HTML 元素，这个 HTML 元素由起始标签 开始。这个元素的内容是：“此文本是粗体的。”。这个 HTML 元素由终止标签 结尾。 标签的作用是定义一个显示为粗体的 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> 标签中的文本是将被浏览器显示出来的文本。 和 标签中的文本将以粗体显示。
HTML文件的基本结构

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

此文本是粗体的。
<body>

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

因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）嵌入网页中，这使用户能够从一个网页站点方便地转移到另一个相关的网页站点。