《html的基础知识》PPT课件.ppt

分享者 邓高鹃 很高兴跟大家见面 我们之所以能见面还要感谢腾讯课堂平台 那我首先自我介绍一下 我的名字叫邓高鹃 我搭档叫闫婷 本套的html教程由我来跟大家分享 很多朋友会问我们这里现在会收费用吗 以后会吗 我想大家可以放一百个心 我们是在公司上班的 有稳定的收入 在这里分享我们知道的东西就是想多帮帮需要帮助的朋友 结实更多的人 将来如果有实力了我们自己创建一个网站开发的团队 这样不是很好吗 那我邓高鹃就先成就你们再塑造自己吧 分享者 邓高鹃 第一节课 HTML的基础认识 一 第一讲课 HTML的特性 第一节课 HTML的介绍 第三讲 HTML的结构 第四讲 HTML的语法 第五讲 HTML的标签 分享者 邓高鹃 第一节课 HTML的介绍 这样的话 我们先来说说HTML是什么东西吧 HTML是目前网络上运用的最为广泛的标记语言 它也是构成网页文档的主要部分 HTML是由它额标签跟属性组成的描述性文本HTML标签可以标识文字呀 图片呀 音乐呀 超链接呀等等 现在也就是2015年HTML的最新版本是HTML5 html是由 hypertextmarkuplanguage的缩写 意思是超文本标记语言 是由美国人蒂姆伯纳斯李创造出来的 分享者 邓高鹃 第二讲课 HTML的特性 HTML的特性如下 第一个 我们可以使用HTML语言创建列表 把相关的信息有效的组织起来 第二个 使用HTML语言标识文本 第三个 课使用HTML穿件超链接 第四个 可以使用HTML语言在网页中显示多媒体信息 比如 图片 声音 视频 等等把网页设计的更加的丰富 第五个 我们可以使用HTM语言制作表格 以便显示大量的数据 第六个 我们可以使用HTML制作表单 分享者 邓高鹃 第三讲课 HTML的结构 不管是学习Java也好还是C 也好 在书写的时候都是有它们自己的结构规范的 同样的HTML也是有它自己的规范 HTML文档一般都包含两个部分 第一个是头部部分 第二个是主题部分 HTML的结构是由三个标签组织起来 其中标记标识HTML文档 标记是标识头部部分标记 标记是标识主题标记 那么现在我们来打个比方跟大家介绍介绍一下HTML的基本结构 说明 这个是注释的意思 我们在编写代码的时候当代码很多的时候 我们就可以用注释来管理我们的代码 不管是在里面书写什么 都不会被浏览器执行 更加不会在浏览器里面显示出来 分享者 邓高鹃 第四讲课 HTML的语法 我在公司上班里面就不会避免很多的规章制度 不管是在哪里都是一样的 比如 请假单它有请假单的书写格式 申请书有它申请书的语法格式 同样的HTML也是存在这样的规则 所以我必须掌握这样的规则了以后才不会出错 我们在编写HTML文档的时候 必须要遵守HTML语法的规范 HTML文档实际上就是一个文本文件 它是由标签跟信息组合而成 当然了这些信息跟标签都是要遵循一定的规律的 不然的话浏览器是午饭解析出来的 那我们现在就来看看HTML语法吧 大家好记得我哦 我可是风一样的男子 邓高鹃 第一 html的所有标签都包含在 这样的符号里面 构成 等等标签 第二 在html文档中 绝大多数的标签都有起始标签跟结束标签 在起始标签跟结束标签中间就包含了元素的主主体 比如 我们一起学习HTML说明 在里面的 我一起学习HTML 就是网页中的内容 第三 其实标签跟结束标签几乎相同只不过要在结束标签前面加上反斜杠 如 第四 标签需要添加属性跟属性值的情况下 必须写在前面的标签里面 属性跟属性值之间我们用 链接在一起 如果需要添加多个属性跟属性值我们必须要通过空格把他们分隔开 分享者 邓高鹃 第四讲课 HTML的语法 第六 少数的属性是没有属性值的 我们直接写属相进去就可以了 第七 元素不是必须要写的 根据自己的需求来添加 第八 HTML的标签可以互相嵌套使用 但是不可以交错嵌套来使用如 这样的嵌套不合法 这样的嵌套合法 第九 html文档的所有信息必须包含在标签里面 所有文档的元信息 就是头部信息 应该包含在标签里面 而html传递信息跟网页的主题内容我们应该放在标签中 第十 对于html来说我们必须要遵守语法规则以外 我们还必须保证文档结构信息的完整性 如下所示 newdocument 分享者 邓高鹃 第四讲课 HTML的语法 呵呵 一下子给大家这么多的内容大家是不是蒙了 现在请大家淡定 我来跟大家一个一个的介绍 就想介绍自家的兄弟一样 我会让你们喜欢它爱上它 第一个 DOCTYPE 文档类型第二个 html html结合第一跟第二 文档类型为HTML 简单吧 第三个 PUBLIC W3C DTDXHTML1 0Transitional EN http www w3 org TR xhtml1 DTD xhtml1 transitional dtd 因为html的document标准是w3c制定的 DTDXHTML1 0 指的是HTML的版本 Transitional 意思是指编写HTML文档使用过度类型 很多设计师就是使用这个 因为简单方便后面再跟大家说说其他几个 http后面是w3c的dtd页面地址 这是标准的申明写法 代表这个网页符合w3c的dtd要求 指的是在文档中的标签中使用xmlns属性 以指定整个文档所使用的主要命名空间 newdocument看看这个 之前谁说过 标签里面都是存放头部信息的 好像就是我吧 风一样的男子对吗 好我们好一个个解剖它 第一个 newdocument 标签就是存放网页的标题 有的朋友会问了 哥们你说的网页标题是什么 那我直接上图吧 分享者 邓高鹃 第四讲课 HTML的语法 看看我截图的部分就是网页的标题 我们来看看他们的源代码 分享者 邓高鹃 第四讲课 HTML的语法 第二个 是标签是用来定义文件的信息 对网页的文件进行说明便于搜索引擎找到 name 是属性 generator 这个是属性值 中文是生成器conten 中文是 内容 这个是属性值 editplus 文字编辑器这里总体的意思是 使用的代码生成器为文本编辑器 第三个 name 是属性 author 中文是协议 就是你设计这个网页需要填写的协议 content 这个是属性 填写网页所有人的姓名 第四个 name 是属性 keywords 是属性值 这个的中文意思是 关键字 content 是内容的意思 这个的属性值是填写你网站的关键词 第五个 name 是属性 description 中文是描述的意思 content 中文是内容的意思 也就是说这里的属性值是填写 你网页里面的简单描述 第六个 http equiv 这个是http协议 content type 内容为类型 charset 这个是HTML的属性 中文意思是 字符集 bg2312 这个是字符编码的一种 简体中文的 常见的还有种是 GBK的 这种事多国语言的 第七个 http equiv http协议 content 这里的content理解为跳转是的意思 也就是几秒后跳转 URL 这个是html的属性 地址的意思 也就是跳转的地址 这个就是跳转的地址 分享者 邓高鹃 第五讲课 HTML的标签 说到html的标签呀 它定义了一百多个标签 那今天刚刚入门 假如我们不讲了就这样下课 没有给你们作业练习也不好 那下面我就对html常用的标签说明一下 然后在后面的课程我们不断的学习 在深入的讲解其他的标签 第一 文档结构标签第二 文本格式标签第三 字符格式标签第四 列表样式标签第五 超链接标签第六 多媒体标签第七 表单标签 分享者 邓高鹃 第五讲课 HTML的标签 第一 文档结构标签文档标签主要用来标识文档的基本结构 主要的就有三种 1 标识html文档的起始标签跟结束标签 2 标识html文档的头部区域 3 标识html的文档的主体区域 列如 我的第一个网页大家好这个是我的第一个网页 这个就是文档的基本结构 注意 在敲打代码的时候标签的层次关系一定好整理好 虽然说不整理浏览器同样可以解析 但是作为开发人员 代码必须要让同事看懂 分享者 邓高鹃 第五讲课 HTML的标签 第一 文本格式标签文本合适标签主要用来标识文本的区块 并且附带一定的文本显示格式 主要说明如下 1 标识网页标题 2 标识标题文本 其中i表示1至6分别表示一到六级 级别高字体越小 3 标识段落文本 4 标识预定义文本 5 标识引用文本 例如 我的第二个网页大家好 这个是我的第二个网页 我今天刚刚认识个一个哥们 他的名字叫做邓高鹃 有时间介绍这个哥们给你们认识 分享者 邓高鹃 第五讲课 HTML的标签 第一 字符格式标签字符格式的标签主要用来标识本分字体字符的语义 很多字符格式标签可以呈现一定的显示效果 比如说加粗显示 斜体显示 下划线显示 语气加强等等 例如 标识强调文本以加粗的效果显示 标识文本以斜体效果显示 标识闪烁文本 以闪烁效果显示 标识放大文本 以放大效果显示 标识缩小文本 以缩小文本效果显示 标识上标文本 以上标效果显示 标识下标文本 以下标效果显示 标识引用文本 以引用效果显示 例如 我的第三个网页例如 针对下面的一元二次方程 x2 5x 4 0分解因式法来演示阶梯思路如下 由 x 1 x 0得 x1 1x2 4 分享者 邓高鹃 第五讲课 HTML的标签 第一 列表样式标签在html文档中 列表的结构可以分为两种类型 有序列表跟无序列表 无序列表使用使用项目符号还标识列表 而有序列表则使用编号来标识列表的项目顺序 具体使用标签说明如下 标识无序列表 标识有序列表 标识列表项目 例如 使用有序列表分别介绍水果的种类我的第四个网页邓高鹃的水果店新鲜上架的水果有 苹果西瓜荔枝龙眼雪梨大家课试试在代码编辑器里面 编写这样的代码 然后在解析到浏览器看看那效果 分享者 邓高鹃 第五讲课 HTML的标签 其实还有另外一种定义列表的方法 还可以定义 定义列表 定义列表是一种特殊的结构 它包括词条和解释两块内容 包含的标签说明如下 标识定义列表 标识词条 标识解释 例如 使用定义列表显示两个成语才解释我的第五个网页成语词条列表知而不言 言而不尽知道的就说 要说的就毫不保留智者千虑 必有一失不管多聪明的人 在很多词的考虑中 也一定会出现个别的错误 分享者 邓高鹃 第五讲课 HTML的标签 好了 最后我们总结一下有序列表跟无序列表还有定义列表的语法 第一个 无序列表语法 内容一内容二内容三 分享者 邓高鹃 第五讲课 HTML的标签 好了 最后我们总结一下有序列表跟无序列表还有定义列表的语法 第二个 有序列表语法 内容一内容二内容三 分享者 邓高鹃 第五讲课 HTML的标签 好了 最后我们总结一下有序列表跟无序列表还有定义列表的语法 第三个 定义列表语法 标题一内容一内容二标题二内容一内容二 分享者 邓高鹃