《简单的HTML网页制作.ppt》由会员分享,可在线阅读,更多相关《简单的HTML网页制作.ppt(16页珍藏版)》请在金锄头文库上搜索。
1、简单的简单的HTMLHTML网页制作网页制作HTMLHTML概念概念n nHTMLHTML(Hyper Text Markup Language Hyper Text Markup Language 超文超文本标识语言)本标识语言)l l是一种用来制作超文本文档的简单标记是一种用来制作超文本文档的简单标记语言。语言。l l用用HTMLHTML编写的超文本文档称为编写的超文本文档称为HTMLHTML文档文档。HTMLHTML文档的编写方法文档的编写方法1.1.手工直接编写手工直接编写l l记事本等,存成记事本等,存成. .htmhtm .html .html格式格式2.2.使用可视化使用可视化H
2、TMLHTML编辑器编辑器l lFrontpageFrontpage、DreamweaverDreamweaver等等3.3.由由Web Web 服务器(服务器( 或称或称HTTP HTTP 服务器)服务器) 一一 方实时动方实时动态地生成。态地生成。网页文件命名网页文件命名1.1.* *. .htmhtm或或* *.html.html2.2.无空格无空格3.3.无特殊符号(例如无特殊符号(例如& &符号),只可以有下符号),只可以有下划线划线“_ _”,只可以为英文、数字,只可以为英文、数字4.4.区分大小写区分大小写5.5.首页文件名默认为:首页文件名默认为:index.htmindex.
3、htm 或或 index.htmlindex.htmlHTMLHTML标签标签1.1.标签的定义:标签的定义:HTMLHTML语言通知浏览器如何显语言通知浏览器如何显示网页内容的方式示网页内容的方式2.2.标签的形式:标签的形式: 所有标记符都用尖括号括起来所有标记符都用尖括号括起来绝大多数标记符是成对出现的,即包括绝大多数标记符是成对出现的,即包括开始标记符和结束标记符,个别是单一开始标记符和结束标记符,个别是单一标记符。例如:标记符。例如: / 开始标记符和结束标记符定义了标记符开始标记符和结束标记符定义了标记符所影响的范围,它们的区别是结束标记所影响的范围,它们的区别是结束标记符多了一个
4、斜线符多了一个斜线/ /,例如:,例如:好好学习好好学习 天天天向上天向上HTMLHTML基本标签介绍基本标签介绍标签标签 描述描述 html 定义定义定义定义HTMLHTMLHTMLHTML文档。文档。文档。文档。 定义文档的头部。定义文档的头部。定义文档的头部。定义文档的头部。定义网页标题。定义网页标题。定义网页标题。定义网页标题。body定义文档的主体。定义文档的主体。定义文档的主体。定义文档的主体。toto定义定义定义定义HTMLHTML标题。标题。标题。标题。定义定义定义定义HTMLHTML段落。段落。段落。段落。定义注释。定义注释。定义注释。定义注释。HTML HTML 文件结构文
5、件结构WebWeb页的结构页的结构n nHTML HTML 必须包含的基本结构标签:必须包含的基本结构标签:l lHTMLHTML标签:标签: l l头标签:头标签: l l标题标签:标题标签: l l正文标签:正文标签: n n三大结构:三大结构: 网页标题网页标题正文正文 示例示例 !- - !- - 网页标题网页标题 !- - !- - 标题标题1 !- 1 1- 段落段落1 !- 1 1 - 标题标题22 段落段落22 标题标题33 段落段落33 标题标题44 段落段落44 标题标题55 段落段落55 标题标题66 段落段落66 HTMLHTML元素元素n nHTML HTML 元素指
6、的是从开始标签(元素指的是从开始标签(start tagstart tag)到结束标签(到结束标签(end tagend tag)的所有代码。)的所有代码。n n元素的内容是开始标签与结束标签之间的内元素的内容是开始标签与结束标签之间的内容容 n n某些某些 HTML HTML 元素具有空内容(元素具有空内容(empty empty contentcontent) n n空元素在开始标签中进行关闭(以开始标签空元素在开始标签中进行关闭(以开始标签的结束而结束)的结束而结束) ,比如,比如 /n n大多数大多数 HTML HTML 元素可拥有属性元素可拥有属性 HTMLHTML元素属性元素属性
7、HTMLHTML元素可以有自己的相关属性,每一个属元素可以有自己的相关属性,每一个属性还可以由我们网页编制者赋一定的值。属性还可以由我们网页编制者赋一定的值。属性总是出现在性总是出现在HTMLHTML元素的开始标签,并且和元素的开始标签,并且和元素名之间有元素名之间有一个空格一个空格分隔;属性总是以名分隔;属性总是以名称称/ /值对的形式出现,比如:值对的形式出现,比如:name=valuename=valuename=valuename=value。属性值用属性值用“”“”引起来。引起来。示例示例 my first page my first page body =yellow a ”河南师
8、范河南师范大学大学 HTMLHTML基本的基本的元素和其元素属性元素和其元素属性元素元素 用于描述不包含在标准用于描述不包含在标准HTMLHTML里的一些文档信息,里的一些文档信息,例如开发工具,作者,网页关键字,网页描述等。例如开发工具,作者,网页关键字,网页描述等。这些定义的内容并不在网页页面中显示,但是一这些定义的内容并不在网页页面中显示,但是一些搜索引擎可以检索这些信息,浏览者可以根据些搜索引擎可以检索这些信息,浏览者可以根据这些关键字或描述查找到该网页。定义在这些关键字或描述查找到该网页。定义在元素中。元素中。l l常用功能是设置自动转址功能常用功能是设置自动转址功能使浏览器自动使浏
9、览器自动从一个地址跳转到另一个地址从一个地址跳转到另一个地址l lmeta meta 元素的常用属性包括:元素的常用属性包括:l lname =name =“”“”给出特性名给出特性名l lcontent =content =“”“”给出特性值给出特性值l lhttp-equiv=http-equiv=“”“” 指定指定 HTTP HTTP 响应名称,通常用响应名称,通常用于替换于替换 name name 属性,属性,HTTP HTTP 服务器使用该属性值为服务器使用该属性值为 HTTP HTTP 响应消息头收集信息响应消息头收集信息1 1、用来标记文档的作者。、用来标记文档的作者。 meta
10、 2 2、用来标记你的页面的解码。、用来标记你的页面的解码。 meta 3 3、用来自动刷新网页方式。用来自动刷新网页方式。 meta 元素元素 元素表明是元素表明是HTMLHTML文档的主体部分。在文档的主体部分。在与与之间,通常都会有很多其它元素;之间,通常都会有很多其它元素;这些元素和元素属性构成这些元素和元素属性构成HTMLHTML文档的主体部分。文档的主体部分。l lbody body 元素的常用属性包括:元素的常用属性包括:l lbackground= background= 背景图片文件名背景图片文件名l lbgcolorbgcolor= = 背景颜色背景颜色l ltext =
11、text = 文本默认颜色文本默认颜色l ltopmargintopmargin = = 信息内容的顶边距离信息内容的顶边距离l lleftmarginleftmargin = = 信息内容的左边距离信息内容的左边距离 示例示例 meta name=author content= meta http-equiv=Content-Type =gb2312 meta http-equiv=refresh content=3; body =30 三秒钟后本网页将自动跳转到三秒钟后本网页将自动跳转到河南师范大学首页河南师范大学首页 小结小结HTMLHTML是表示网页的一种规范,它通过标签定是表示网页的一种规范,它通过标签定义了网页内容的显示。义了网页内容的显示。最基本的最基本的HTMLHTML标签包括:标签包括:HTMLHTML标签标签和和首部标签首部标签和和正文标签正文标签和和。bodybody标签包括一些常用属性,用于控制网页标签包括一些常用属性,用于控制网页的基本显示效果。的基本显示效果。