初识html课件教学提纲.ppt

《初识html课件教学提纲.ppt》由会员分享，可在线阅读，更多相关《初识html课件教学提纲.ppt（21页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、初识初识htmlhtml课件课件网页是由什么制作出来的？网页是由什么制作出来的？目目 标标一、认识什么是一、认识什么是HTML二、二、HTML标记的语法标记的语法三、掌握常用的三、掌握常用的HTML标记的应用标记的应用重点：重点：认识认识HTML和和HTML标记标记难点：难点：常见的常见的HTML标记的应用标记的应用HTML简介简介HTML是是Hyper Text Markup Language的第一个大的第一个大写字母的组合，中文意思为：写字母的组合，中文意思为：超文本超文本标记语言标记语言（布局和排版）（布局和排版）。HTML标记告诉标记告诉Web浏览器浏览器如何显示网页。如何显示网页。一

2、个一个HTML文件必须是一个文件必须是一个htm或或html扩展名的文扩展名的文件。件。HTML文件的创建方式：文件的创建方式：a.手工直接编写（例如手工直接编写（例如:记事本）。记事本）。b.通过图形化的通过图形化的HTML开发软件开发软件Dreamweaver。c.由由Web服务器上的动态网页程序生成。服务器上的动态网页程序生成。标记就是一些用来描述网页内容的一些特定标记就是一些用来描述网页内容的一些特定符号。符号。HTML不是一种编程语言，而是一种不是一种编程语言，而是一种描述性的描述性的标记语言标记语言，用于描述网页中内容的，用于描述网页中内容的显示方式，比如，文字以什么颜色、大小来显

3、示方式，比如，文字以什么颜色、大小来显示，这些都是利用显示，这些都是利用html标记来实现的。标记来实现的。HTML 标记标记HTML 标记标记HTML标记是用来组成标记是用来组成HTML元素元素的。的。HTML标记用两个尖括号标记用两个尖括号“”括起来。括起来。HTML标记标记一般是一般是双标记，如双标记，如和和。前一个标记是前一个标记是起始标记起始标记，后一个标记为，后一个标记为结束标记结束标记。两个标记之间的文本是两个标记之间的文本是html元素的元素的内容内容。某些标记称为某些标记称为“单标记单标记”，因为它只需单独使用，因为它只需单独使用就能完整地表达意思，如就能完整地表达意思，如H

4、TML标记的语法标记的语法HTML标记的类型：单标记与双标记标记的类型：单标记与双标记一、单标记一、单标记（1）单一型，无属性值。单一型，无属性值。如如（2）单一型，有属性值。单一型，有属性值。如：如：二、双标记二、双标记（3）没有属性值。没有属性值。如：如：（4）有属性值。有属性值。如：如：1.双标记：双标记：内容内容2.单标记：单标记：3.标记的属性：标记的属性：内容内容说明：说明：A、标记与属性、属性之间以、标记与属性、属性之间以空格分开空格分开B、属性、属性不区分先后顺序不区分先后顺序；并且属性；并且属性不是必须的不是必须的重点强调：虽然在重点强调：虽然在HTML中标记不区别大小写，中

5、标记不区别大小写，但在但在XHTML中所有标记都必须小写，所以建议中所有标记都必须小写，所以建议从现在开始，所有标记都采用小写。从现在开始，所有标记都采用小写。HTML标记语法总结标记语法总结HTML文档结构文档结构所有的网页文件，通常由四对标记来构成文档的骨所有的网页文件，通常由四对标记来构成文档的骨架，它们是：架，它们是：标题标题 正文正文 标识网页文件的开始标识网页文件的开始与结束，所有的与结束，所有的html元素都要放在这对标元素都要放在这对标记中记中标识网页文件的头标识网页文件的头部信息，如标题、部信息，如标题、搜索引擎关键字等搜索引擎关键字等标识网页文件的标题标识网页文件的标题标识

6、网页文件的主体部分标识网页文件的主体部分 这是我的第一个网页这是我的第一个网页 这是我的第一个网页这是我的第一个网页 你好！你好！HTML 标签标签 标签定义段落标签定义段落属性属性值值描述描述alignleft 规定段落中文规定段落中文 本的对其方式本的对其方式rightcenterjustify可选属性：可选属性：HTML 标签标签定义和用法定义和用法 标签可定义锚。锚标签可定义锚。锚(anchor)有两种用法：有两种用法：通过使用通过使用 href 属性，创建指向另外一个文属性，创建指向另外一个文档的链接（或超链接）档的链接（或超链接）通过使用通过使用 name 或或 id 属性，创建一

7、个文档内属性，创建一个文档内部的书签（也就是说，可以创建指向文档片部的书签（也就是说，可以创建指向文档片段的链接）段的链接）元素最重要的属性是元素最重要的属性是 href 属性，它指定属性，它指定链接的目标。链接的目标。HTML 标签标签img 元素可定义一副图像。元素可定义一副图像。属性属性值值描述描述alttext规定图像的替代文本规定图像的替代文本srcURL规定显示图像的规定显示图像的URL两个重要的属性：两个重要的属性：HTML 标签标签定义和用法定义和用法 标签定义标签定义 HTML 表格。表格。简单的简单的 HTML 表格由表格由 table 元素以及一个或元素以及一个或多个多个

8、 tr、th 或或 td 元素组成。元素组成。tr 元素定义表格行，元素定义表格行，th 元素定义表头，元素定义表头，td 元素定义表格单元。元素定义表格单元。更复杂的更复杂的 HTML 表格也可能包括表格也可能包括 caption、col、colgroup、thead、tfoot 以及以及 tbody 元元素。素。HTML 标签标签定义和用法定义和用法 标签用于搜集用户信息。标签用于搜集用户信息。根据不同的根据不同的 type 属性值，输入字段拥有很属性值，输入字段拥有很多种形式。输入字段可以是文本字段、复多种形式。输入字段可以是文本字段、复选框、掩码后的文本控件、单选按钮、按选框、掩码后的文本控件、单选按钮、按钮等等。钮等等。HTML 标签标签定义和用法定义和用法 标签定义一个按钮。标签定义一个按钮。在在 button 元素内部，您可以放置内容，元素内部，您可以放置内容，比如文本或图像。这是该元素与使用比如文本或图像。这是该元素与使用 input 元素创建的按钮之间的不同之处。元素创建的按钮之间的不同之处。实例演示：实例演示：如下图，我们做一个百度的首页。如下图，我们做一个百度的首页。如下图，我们做一个百度的首页。如下图，我们做一个百度的首页。课后练习：课后练习：采用表格布局的方法，做一个高仿的采用表格布局的方法，做一个高仿的hao123网站：网站：结束结束