第一章 HTML.pptVIP

第一章 HTML 主讲：卢健良 HTML基础知识 HTML文本处理 HTML超链接 HTML图像处理 HTML表格标签 HTML表单标签 HTML框架页 主要内容 掌握HTML的文档结构 掌握HTML文本处理方法和技巧 掌握HTML超链接和图像处理方法 掌握HTML表格和表单使用技巧 掌握框架页的使用 本讲目标 什么是HTML？ HTML是用来制作网页的标记语言 HTML是Hypertext Markup Language的英文缩写,即超文本标记语言 HTML是一种标记语言,不需要编译,直接由浏览器执行 HTML文件是一个文本文件,包含了一些HTML元素,标签等.HTML文件必须使用html或htm为文件名后缀 HTML是大小写不敏感的,HTML与html是一样的 HTML是由W3C的维护的 一、HTML简介 HTML的语法结构简单，基本由以下部分构成 二、HTML语法 HTML标签 是HTML语言的基本组成单位 是由””和””包围起来的关键词 不区分大小写，出于习惯建议使用小写 每个HTML标签通常会有自己的属性。如：font size=“1”size为1的文字/font HTML标签书写形式 二、HTML语法 HTML标签属性 通常每个HTML标签都拥有自己的属性 属性由属性名和属性值成对出现 处于习惯属性值使用双引号引起来 二、HTML语法 HTML元素 HTML元素是指从开始标签到结束标签的所有代码 二、HTML语法 开始标签 结束标签 HTML元素 HTML文档 也称之为“网页” 互联网所有内容就是由一个个的HTML文档提供的 HTML文档是一个文本文件 文档的后缀为.html或者.htm 二、HTML语法 HTML语法实例 二、HTML语法 HTML文字排版标签 段落标签p/p 用于标明该段文字属于同一个段落 强制换行标签br/ 用于段落内换行 标题标签h1/h1……h6/h6 用于表示文档内容的标题内容，以及标题内容的级别 三、HTML标签 HTML文字排版标签 无序列表ul/ul 无序列表标记，表示列表所包含的项是没有先后顺序的 列表项使用li表示 有序列表ol/ol 有序列表标记，表示列表所包含的项是有先后顺序的 列表项使用li表示 列表项li/li 代表有序列表或者无序列表的列表项 只能在ul/ul或者ol/ol内部使用 三、HTML标签 HTML文字排版标签 上标标签sup/sup 上标标签 下标sub/sub 下标标签 预格式化标签pre/pre 通常用来显示计算机语言源代码 三、HTML标签 HTML中特殊符号的使用 在页面中显示“”和“” 使用lt;和gt; 在页面中使用空格 nbsp; 注意不要使用多个nbsp;表示多个空格，因为不同的浏览器对空格的距离有不同的实现。 在页面中使用版权符号 copy; 在页面中使用商标注册符号 reg; 三、HTML标签 HTML图片处理标签 img / img/标签的重要属性 图片大小 img width= height=/ 图标替代文体 img alt=图片替代的文本内容/ 如果没有出现图片，那么将以图片替代文本显示 图片提示 img title=提示文本/ 在鼠标放置图片上面时提示的文本 三、HTML标签 HTML图片的分类： 内容图片 修饰性图片 网页中常用图片的格式 gif格式，色彩表现少，但是解析速度快，还可以实现“动画”效果，是网页“修饰”图片的第一选择 Jpg格式，色彩表现多，是网页中内容图片的第一选择 三、HTML标签 网页的路径问题 相对路径 参照自身的位置，而定义的路径，叫做相对路径 相对路径有三种表示方法 可以使用“.”代表当前文档自身的当前所在文件夹，当然，也可省略 可以使用“..”代表当前文档所在文件夹得上一级文件 可以使用“/”代表网站的根目录(放在磁盘中，则为磁盘根目录) 三、HTML标签 三、HTML标签 根文件夹 wwwroot 子文件夹 example 当前网页 ex.html 图片文件夹 image 图片 1.jpg 根文件夹 wwwroot 子文件夹 example 图片文件夹 image 图片 1.jpg 当前网页 ex.html 在ex.html中插入1.jgp路径应该怎么写? HTML超链接 通过超链接，网页页面之间就可以相互跳转和导航 文字超链接 a href=“”百度/a a href=“”img src=“images/baidu.jpg”//a 电子邮件超链接 a href=“mailto:kaximan@”发送邮件给我/a 三、HTML标签 HTML超链接 锚点的使用 当文档内容很多的时候，使用a标签的name属性建立锚点，使用#name指向锚点 建立锚点 a name=“