前言:

H5是目前行业里非常热门的一种语言,学习难度较低,可以快速入门。我个人也在学习H5,采用写博客的方式来梳理我学到的知识点,也分享给更多想学习的人一起来学习。

Tip:个人学习过程中梳理的知识点,如果有错误,欢迎评论指出

HTML介绍

1、什么是HTML

字面上的意思,HTML(Hyper Text Markup Language)超文本标记语言。是一种语言,但这里要注意的是,HTML不是编程语言。编程语言通常会有类、变量之类的,HTML没有,HTML只是一种标记语言。

1.1 超文本

超文本,本质上还是一种文本,不过比一般的文本功能强大的多。

普通文本只能包含文字,而超文本里可以包含音频视频游戏链接、甚至程序等等。比普通文本强大的多,所以称之为超文本。

1.2 标记语言

HTML中最重要的就是就是各种标记,标记指的是HTML中的语法。在HTML中所有的语法都是通过标记来实现的。标记因翻译不同,也称为标签节点元素等。

HTML的核心是语义:我们之后在使用标签的时候,不需要考虑标签到底在网页中显示成什么效果,只需要注意标签本身的含义是什么。

那么怎么来表示标记呢。标记在HTML中用<any>表示。两个尖括号包住一个英文字符。

例如:

<br>

上面的就是一个标签,这个标签标示在网页中的功能是换行,相当于键盘上的enter回车键。这样单个出现的标签叫做单标签,之后还会介绍成对出现的标签叫做双标签。

需要注意的是,在HTML5之前。单标签在使用时,需要在标签的最后加上"/"

例如上面的<br>标签,在老版本的HTML中就需要写成<br/>

所以有时我们在看到标签后有“/”时,那就是老版本的HTML

2、HTML5主体结构

2.1 如何创建HTML

html的创建非常简单,只需两步

第一步、空白处右击新建txt文本文档

第二部、将文本文档的后缀名.txt修改成.html

之前老版本的时候,后缀名存在.htm  这是三个字符的后缀,是收到当年操作系统限制的原因。现在开发html5网页文件必须使用.html后缀

2.2主体结构

当我们创建好html文件后,使用合适的编辑器打开(可以使用,sublime ,HBuilder ,WebStorm,DreamWeaver等编辑器)

这里不推荐使用记事本进行编辑,记事本中有隐藏字符,直接使用记事本编辑复制出去执行有可能会出错

下面我们来写下html网页文件的主题结构

 <!DOCTYPE html>
<html>
<head>
<meat charset="UTF-8">
<title>网页标题<title>
</head>
<body>
网页主体内容
</body>
</html>

上面的html主体结构是每个html网页中都必须有的结构

2.3主体结构介绍

<!DOCTYPE html>

表示文档声明,告诉浏览器,当前页面使用的是HTML5的文档格式。如果不写此声明,浏览器会将网页降级处理,可能会使用老版本html4或更低的文档格式。

<html>
</html>

声明html标签的主体,所有的html网页内容都写在<html></html>标签中

<head>
</head>

head标签中写的是网页的一些设置信息,包含字符集,标题,css样式等。

<body>
</body>

body标签中写的是网页的主体内容,我们浏览网页时所看到的所有内容都是写在body标签中

<meat charset="UTF-8">

meat标签的作用有很多,通常只需要写这一句,表示将网页文档的字符集设置为UTF-8,让网页能够支持常见中文

<title><title>

title标签里写的是网页的标题,我们打开网页时,最上方浏览器标签栏里显示的内容就是title标签里的

如图所示:

3、一个合格的网页需要包含哪些内容

HTML:构建网页的结构

CSS:网页的美化

JavaScript:网页的交互

举个例子:这样开发网页的过程就相当于是

毛坯房 –> 装修 –> 智能家居

HTML发展史

H5草案 前身名为Web Application 1.0 ,于2004年被WHATWG提出,于2007年被W3C接受,并成立了新的HTML工作团队

HTML5 狭义上为:html4的下一代产品

HTML5广义上为:新一代的富客户端解决方案

HTML 1.0超文本标记语言(第一版)——在1993年6月作为互联网工程工作小组(IETF)工作草案发布(并非标准) ​

HTML 2.0——1995年11月作为RFC 1866发布,在RFC 2854于2000年6月发布之后被宣布已经过时 ​

HTML 3.2——1997年1月14日,W3C推荐标准 ​ HTML 4.0——1997年12月18日,W3C推荐标准 ​

HTML 4.01(微小改进)——1999年12月24日,W3C推荐标准 ​ XHTML1.0——发布于2000年1月26日,是W3C推荐标准,后来经过修订于2002年8月1日重新发布 ​ XHTML 1.1,于2001年5月31日发布,W3C推荐标准 ​ XHTML 2.0,W3C工作草案 ​ XHTML 5,从XHTML 1.x的更新版,基于HTML 5草案 ​ HTML 5——2014年10月28日,W3C推荐标准 ​ 前身:Web Applications 1.0 ​ 于2004年被WHATWG提出 ​ 于2007年被W3C接纳 ​ 在2008年1月22日,第一份正式草案发布 ​

HTML5发展史

HTML 5 的第一份正式草案已于2008年1月22日公布。HTML5 仍处于完善之中。然而,大部分现代浏览器已经具备了某些HTML5 支持。 ​

2012年12月17日,万维网联盟(W3C)正式宣布凝结了大量网络工作者心血的HTML5规范已经正式定稿。根据W3C的发言稿称:“HTML5是开放的Web网络平台的奠基石。” ​

2013年5月6日, HTML 5.1正式草案公布。该规范定义了第五次重大版本,第一次要修订万维网的核心语言:超文本标记语言(HTML)。在这个版本中,新功能不断推出,以帮助Web应用程序的作者,努力提高新元素互操作性。 ​

本次草案的发布,从2012年12月27日至今,进行了多达近百项的修改,包括HTML和XHTML的标签,相关的API、Canvas等,同时HTML5的图像img标签及svg`也进行了改进,性能得到进一步提升。 ​

目前在开发的领域,大家说的H5开发其实指的是HTML5 + CSS3 + JavaScript等技术。 ​ 在目前的软件开发生态链中,H5的技术充斥着很多的领域。无论是网站开发、移动端开发、软件开发、游戏等等。 ​ ​

HTML基础介绍的更多相关文章

  1. Web3D编程入门总结——WebGL与Three.js基础介绍

    /*在这里对这段时间学习的3D编程知识做个总结,以备再次出发.计划分成“webgl与three.js基础介绍”.“面向对象的基础3D场景框架编写”.“模型导入与简单3D游戏编写”三个部分,其他零散知识 ...

  2. C++ 迭代器 基础介绍

    C++ 迭代器 基础介绍 迭代器提供对一个容器中的对象的访问方法,并且定义了容器中对象的范围.迭代器就如同一个指针.事实上,C++的指针也是一种迭代器.但是,迭代器不仅仅是指针,因此你不能认为他们一定 ...

  3. Node.js学习笔记(一)基础介绍

    什么是Node.js 官网介绍: Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. Node.js us ...

  4. Node.js 基础介绍

    什么是Node.js 官网介绍: Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. Node.js us ...

  5. 1、git基础介绍及远程/本地仓库、分支

    1. Git基础介绍 基于Git进行开发时,首先需要将远程仓库代码clone到本地,即为本地仓库.后续大部分时间都是基于本地仓库上的分支进行编码,最后将本地仓库的代码合入远程仓库. 1.1. 远程仓库 ...

  6. git基础介绍

    git基础介绍 这是git操作的基础篇,是以前的写的操作文档,就没有进行手打,直接把图片贴进来了,你们担待哈,有不正确的地方可以指正出来,我将在第一时间去修改,多谢哈! 一.文件状态:git系统的文件 ...

  7. OSPF基础介绍

    OSPF基础介绍 一.RIP的缺陷 1.以跳数评估的路由并非最优路径 2.最大跳数16导致网络尺度小 3.收敛速度慢 4.更新发送全部路由表浪费网络资源 二.OSPF基本原理 1.什么是OSPF a& ...

  8. iOS系统及客户端软件测试的基础介绍

    iOS系统及客户端软件测试的基础介绍 iOS现在的最新版本iOS5是10月12号推出,当前版本是4.3.5 先是硬件部分,采用iOS系统的是iPad,iPhone,iTouch这三种设备,其中iPho ...

  9. 高通camera结构(摄像头基础介绍)

    摄像头基础介绍 一.摄像头结构和工作原理. 拍摄景物通过镜头,将生成的光学图像投射到传感器上,然后光学图像被转换成电信号,电信号再经过模数转换变为数字信号,数字信号经过DSP加工处理,再被送到电脑中进 ...

  10. Erlang基础 -- 介绍 -- Wordcount示例演示

    在前两个blog中,已经说了Erlang的历史.应用场景.特点,这次主要演示一个Wordcount的示例,就是给定一个文本文件,统计这个文本文件中的单词以及该单词出现的次数. 今天和群友们讨论了一个问 ...

随机推荐

  1. C#跟Lua如何超高性能传递数据

    前言 在UWA学堂上线那天,我买了招文勇这篇Lua交互的课程,19块还算值,但是前段时间太忙,一直没空研究,他的demo是基于xlua的,今天终于花了大半天时间在tolua下跑起来了,记录一下我的理解 ...

  2. c++小游戏——杀手

    杀手小游戏 会有一个存活者:(1 2 3 4 5),如果出现(1 0 3 4 5),代表二号已经死了. 一号有3次复活权 且有一次随机诅咒权(即当自己被杀死时,会随机诅咒另外一个人,当然不是死人或自己 ...

  3. [USACO10FEB]给巧克力Chocolate Giving

    题意简叙: FarmerFarmerFarmer JohnJohnJohn有B头奶牛(1<=B<=25000)(1<=B<=25000)(1<=B<=25000), ...

  4. canvas动画:气泡上升效果

    HTML5中的canvas真是个很强大的东西呢! 这几天突发奇想想做一个气泡上升的动画,经过许久的思考和多次失败,终于做出了如下效果 由于是录制的gif图,看着会有点卡顿,实际演示是很自然的 想要做出 ...

  5. Excel催化剂开源第3波-修复ExcelCom加载项失效问题及WPS可调用Com加载项的方法

    为了还原一个干净无侵扰的网络世界,本文将不进行大规模地分发,若您觉得此文有用,不妨小范围地分享到真正有需要的人手中 功能概述 修复ExcelCom加载项常见问题,如每次需重新勾选COM加载项或COM加 ...

  6. 利用DOMNodeInserted监听标签内容变化

    var exeFlag = 0;//控制执行业务次数标记$('#list1').bind('DOMNodeInserted', function () { if(!/img/.test($(" ...

  7. 温故而知新,重温 Java 7 的那些“新”特性

    2009 年 4 月 20 日,Java 的亲生父亲 Sun 被养父 Oracle 以 74 亿美元收购,这在当时可是一件天大的事.有不少同学都担心 Java 的前途,我当时傻不啦叽地也很担心:自己刚 ...

  8. MyBatis 文档 完整版

    框架技术 1.框架技术 01.是一个应用程序的半成品 02.提供可重用的公共结构 03.按一定规则组织的一组组件 2.分析优势 01.不用再考虑公共问题 02.专心的业务实现上 03.结构统一,易于学 ...

  9. bean的创建(五)第三部分 bean工厂方法参数的解析

    准备好一系列参数之后,开始参数类型的转换,方法参数的对应. ConstructorResolver.createArgumentArray private ArgumentsHolder create ...

  10. 「玩转Python」打造十万博文爬虫篇

    前言 这里以爬取博客园文章为例,仅供学习参考,某些AD满天飞的网站太浪费爬虫的感情了. 爬取 使用 BeautifulSoup 获取博文 通过 html2text 将 Html 转 Markdown ...