HTML5+CSS3程序设计第2章 初识HTML5.pptVIP

* 第2章 初识HTML5 01 HTML5概述 04 图片标签和列表标签 03 段落标签 02 文字标签 05 链接标签 HTML5概述 1 主要内容 HTML的发展史 1 什么是HTML5 2 HTML5的基本结构 3 如何创建HTML5页面 4 HTML发展史 1993年 草案 1995年 HTML2.0 1996年 HTML3.2 1997年 HTML4.0 1999年 HTML4.01 2008年 HTML5 什么是HTML5 HTML语言是一种简易的文件交换标准，用于物理的文件结构，它旨在定义文件内的对象和描述文件的逻辑结构，而并不定义文件的显示。 HTML是纯文本类型的语言，使用HTML编写的网页文件也是标准的纯文本文件。我们可以用任何文本编辑器。 HTML5文件的基本结构 !DOCTYPE HTML html 文档的声明 /html 标记文档的开始和结束 文档的头部 head /body /head /body 源信息标记 标题标记 主体内容 title第一个HTML文件/title meta charset=utf-8 HTML5文件的基本结构 在HTML标记中不区分大小写。例如，在HTML里，htmlHtmlHTML三者是相同的 使用Dreamweaver创建HTML5文件 文字标签 2 主要内容 普通文字 1 特殊符号 2 标题字标签 3 修饰文字标签 4 修饰字体标签 5 普通文字 在HTML5页面里插入普通文字的方法：在body标签和/boay标记之间直接输入文字 显示特殊符号 HTML中，普通符号的插入可以通过直接键盘输入。而一些特殊符号如数字运算符（≤、×、÷）、拉丁语符号（ê、§）以及版权符号?等的插如可以借助代码插入。 特殊符号 符号码 特殊符号 符号码 回车 quot 空格 nbsp amp br / lt ? laquo gt ? raquo ? copy ? reg 标题字标签 标签： h1~h6 功能： 显示标题文字，字号逐渐减小 h1文字内容/h1 h1文字内容/h1 语法： 修饰文字标签 strike/strike删除线标签 修饰文字标签 b/b加粗标签 i/i 斜体标签 sub/sub下标标签sup/sup上标标签 u/u下划线标签 修饰字体标签 标签： font/font 功能： 改变文字的字体、字号以及颜色 font size=字号 color=字体颜色 face=字体文字内容/font 语法： 修饰字体标签 示例 段落标签 3 主要内容 段落标签 1 取消文字换行标签 2 修饰段落对齐属性 3 保留原始排版标签 4 段落标签 标签： p/p 功能： 修饰段落、自动换行 p段落文字/p 语法： 在HTML5中，段落标签既可以成对使用，也可以只单独使用的p，对于初学者来说，为了规范代码，建议成对使用p标签 取消文字换行标签 HTML中，文字内容过长 自动换行 取消文字换行标签 标签： nobr/nobr 功能： 修饰段落、自动换行 nobr段落文字/nobr 语法： 在HTML5中，使用了nobr/nobr标签后，当文字内容过长时，浏览器下方会出现滚动条。 修饰段落对其属性 属性： align 属性值： left、center、right p align=”left”/p 表达： 示例 align属性可以应用于多个标签，还请读者不要局限于本案例的p标签 保留原始排版标签 标签： pre/pre 功能： 保留原始排版 p原始排版内容/p 语法： 示例 图片标签列表标签 4 主要内容 插入图片标签 1 插入列表标签 2 插入图片标签 标签： img img src=”图片地址” 语法： 属 性 说 明 src 图像的源文件 alt 提示文字 width，height 高度、宽度 border 边框 vspac 垂直间距 hspace 水平间距 插入列表标签 列表 有序列表 定义列表 无序列表 有序列表 说明： 功能： 插入有序列表，列表项目之间有顺序性 ol type=”排序类型” start=”起始数值” li列表项1li li列表项2li /ol 语法： “start”和“type”为有序列表的属性值 start的属性值为数值 type的属性值有1，a，A，i，I 含义分别为：阿拉伯数字，小写英文字母，大写英文字母，小写罗马字母和大写罗马字母 示例 *