前端HTML以及HTML5(基本标签)

前面一章介绍了一下前端的发展,这章简单介绍一下html的发展以及基本的标签。

一、HTML的发展史

  1、概念

    超文本标记语言(HyperText Markup Language,简称HTML)是为 [ 网页创建和其他可在浏览器中看到的信息 ] 设计的一种标记语言。

  2、相关发展历程:
    * 超文本标记语言(第一版) --- 在1993年6月作为互联网工程小组(IETF)工作草案发布(并非标准)

    * HTML2.0 --- 1995年11月作为RFC 1866发布,在RFC 2854于2000年6月发布之后被宣布已经过时

    * HTML3.2 --- 1996年1月14日,W3C推荐标准

    * HTML4.0 --- 1997年12月18日,W3C推荐标准

    * HTML4.01(微小改进) --- 1999年12月24日,W3C推荐标准

    * ISO/IEC 15445:2000("ISO HTML") --- 2000年5月15日发布,基于严格的HTML 4.01语法,是国际标准化组织和国际电工委员会的标准

    * XHTML 1.0 --- 发布于2000年1月26日,是W3C推荐标准,后来经过修订于2002年8月1日重新发布

    * XHTML 1.1 --- 于2001年5月31日发布

    * XHTML 2.0 终止

    * HTML5(最终版) --- 2014年10月29日,万维网联盟泪流满面地宣布,经过几乎8年的艰辛努力,HTML5标准规范终于最终制定完成了,并已公开发布。

  3、HTML5的艰辛发展历程

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

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

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

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

    2014年10月29日,万维网联盟泪流满面地宣布,经过几乎8年的艰辛努力,HTML5标准规范终于最终制定完成了,并已公开发布。

    支持Html5的浏览器包括Firefox(火狐浏览器),IE9及其更高版本,Chrome(谷歌浏览器),Safari,Opera等;国内的 遨游浏览器(Maxthon),以及基于IE或Chromium(Chrome的工程版或称实验版)所推出的360浏览器、搜狗浏览器、QQ浏览器、猎豹 浏览器等国产浏览器同样具备支持HTML5的能力。

   4、xml、xhtml、html、三者关联以及区别

    HTML(HyperText Markup Language),超文本标记语言。“超文本”就是指页面内可以包含图片、链接,甚至音乐、程序等非文字元素,“标记”是指用特定的标记符号来标记要显示的内容的各个部分。超文本标记语言是标准通用标记语言下的一个应用,也是一种规范,一种标准,它被设计用来显示数据。HTML文本就是我们通常所说的网页,扩展名可以是html或htm。

    XML(Extensible Markup Language),可扩展标记语言。XML是标准通用标记语言的子集,是一种用于标记电子文件使其具有结构性的标记语言,它被设计用来传输和存储数据,是对超文本标记语言的补充。可扩展标记语言是一种元标记语言,即定义了用于定义其他特定领域有关语义的、结构化的标记语言,这些标记语言将文档分成许多部件并对这些部件加以标识。它能够更精确地声明内容,方便跨越多种平台的更有意义的搜索结果。它提供了一种描述结构数据的格式,简化了网络中数据交换和表示,使得代码、数据和表示分离,并作为数据交换的标准格式,因此它常被称为智能数据文档,文件扩展名为xml。

    XHTML(Extensible HyperText Markup Language),可扩展超文本标记语言。XHTML基于可扩展标记语言(XML)。XHTML就是一个扮演着类似HTML的角色的可扩展标记语言(XML)。XHTML是一种增强了的HTML,XHTML 是更严谨更纯净的 HTML 版本。它的可扩展性和灵活性将适应未来网络应用更多的需求。XML虽然数据转换能力强大,完全可以替代HTML,但面对成千上万已有的基于HTML语言设计的网站,直接采用XML还为时过早。因此,在HTML4.0的基础上,用XML的规则对其进行扩展,得到了XHTML。所以,建立XHTML的目的就是实现HTML向XML的过渡。XHTML 于2000年的1月26日成为 W3C (World Wide Web Consortium ,万维网联盟),文件扩展名为xhtml.。

    总结:HTML、XML和XHTML都是标准通用标记语言的一个子集。HTML被设计用来显示数据,其焦点是数据的外观;XML被设计用来传输和存储数据,其焦点是数据的内容;XHTML是更严格更纯净的 HTML 版本,是作为一种 XML 应用被重新定义的 HTML,设计的目的是为了取代HTML以适应未来网络更多的需求。它们都可以用来开发网页,但就目前来看,网页开发中HTML还是占绝对的主流,现在最新版本HTML5也备受推崇。可拓展标记语言XML广泛运用于各种应用程序中数据的存储(例如各种配置文件)和应用程序间的数据传输,可以说是一项必须掌握的技术。至于可扩展超文本标记语言XHTML,在2009年W3C已经宣布停止了对XHTML2的开发,转而大力支持HTML5。

二、HTML4.01(HTML5新增的下一章在介绍)

  1、基本结构

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8" />
 5         <title></title>
 6     </head>
 7     <body>
 8         
 9     </body>
10 </html>

   2、基本元素(具体说明w3school上都有,我就不做具体说明了,链接:http://www.w3school.com.cn/tags/index.asp)

    常用:html、head、meta、title、link、style、body、h1-h6、div、a、p、span、ul、li、dl、dt、dd、ol、img、table、thead、tbody、tfoot、tr、td、caption、i、b、form、label、input、button、textarea、selected、option、optgroup、script、frame、br、hr、em、strong。

    不常用:上面的这些基本上工作中用的比较多的,还有很多样式标签现在都不推荐使用了,我这里就不介绍了。

   3、标准属性(链接:http://www.w3school.com.cn/tags/html_ref_standardattributes.asp)

    id、class、title、style、dir、lang

   4、事件属性(链接:http://www.w3school.com.cn/tags/html_ref_eventattributes.asp)

    onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup

总结:HTML 是一种在 Web 上使用的通用标记语言。HTML 允许你格式化文本,添加图片,创建链接、输入表单、框架和表格等等,并可将之存为文本文件,浏览器即可读取和显示。(html是相对简单的还有css,只要会基础的html还有css就可以开始切静态页面了,所以说前端入门很简单,难的是js)

下面我在介绍一下HTML5新增

   

  

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/369139.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

方法内联在JVM中有多积极?

IntelliJ IDEA中使用Ctrl Alt M 提取方法 。 Ctrl Alt M。 这就像选择一段代码并按此组合一样简单。 Eclipse也有它 。 我讨厌冗长的方法。 对于我来说&#xff0c;闻起来太久了&#xff1a; public void processOnEndOfDay(Contract c) {if (DateUtils.addDays(c.getCrea…

Python正则表达式基础

1. 正则表达式基础 1.1. 简单介绍 正则表达式并不是Python的一部分。正则表达式是用于处理字符串的强大工具&#xff0c;拥有自己独特的语法以及一个独立的处理引擎&#xff0c;效率上可能不如str自带的方法&#xff0c;但功能十分强大。得益于这一点&#xff0c;在提供了正则表…

hexdump mysql_linux下mysql数据库定时备份

备份操作命令&#xff1a;mysqldump -uroot --default-character-setutf8 --hex-blob -p123456 test_oa > /usr/software/data_backup/mysql_backup/test.sql以下是完整脚本&#xff0c;加--default-character-setutf8 --hex-blob 防乱码发生。#!/bin/bashdatabasestestus…

新建一个页面

今天我刚好要做一个单页面来展示某些东西。 就一起来看看吧&#xff0c;初学者写的不好请自闭双眼。 先上代码吧&#xff0c;大家看看有什么需要修改的地方。 1 <!DOCTYPE html>2 <html lang"en">3 4 <head>5 <meta charset"UTF-8&q…

Java并发:隐藏线程死锁

大多数Java程序员熟悉Java线程死锁概念。 它本质上涉及2个线程&#xff0c;它们彼此永远等待。 这种情况通常是平面&#xff08;同步&#xff09;或ReentrantLock&#xff08;读或写&#xff09;锁排序问题的结果。 Found one Java-level deadlock:"pool-1-thread-2"…

vue中使用axios发送请求

我们知道&#xff0c;vue2.0以后&#xff0c;vue就不再对vue-resource进行更新&#xff0c;而是推荐axios&#xff0c;而大型项目都会使用 Vuex 来管理数据&#xff0c;所以这篇博客将结合两者来发送请求 1.安装axios cnpm i axios -S 2.方案一&#xff1a;修改原型链 首先&…

django缓存

由于Django是动态网站&#xff0c;所有每次请求均会去数据进行相应的操作&#xff0c;当程序访问量大时&#xff0c;耗时必然会更加明显&#xff0c;最简单解决方式是使用&#xff1a;缓存&#xff0c;缓存将一个某个views的返回值保存至内存或者memcache中&#xff0c;5分钟内…

linux 输入法成繁体字_寻找Ubuntu中繁体字输入法

当客户来自港台地区时&#xff0c;英文和繁体字就成了交流的主要工具。windows下我们有搜狗输入法可以切换简体与繁体&#xff0c;那么Ubuntu下怎么办&#xff1f;這是我第一次考慮這個問題&#xff0c;在我的印象裏Linux下的中文輸入法還不是那麼完善&#xff0c;所以我進行了…

vue跨域解决方法

vue跨域解决方法 vue项目中&#xff0c;前端与后台进行数据请求或者提交的时候&#xff0c;如果后台没有设置跨域&#xff0c;前端本地调试代码的时候就会报“No Access-Control-Allow-Origin header is present on the requested resource.” 这种跨域错误。 要想本地正常的调…

Spring 3.2的REST异常处理

1.概述 本文将重点介绍如何使用REST API的Spring实现异常处理 。 我们将介绍在Spring 3.2之前可用的较旧的解决方案&#xff0c;然后是对Spring 3.2的新支持。 本文的主要目的是展示如何最好地将应用程序中的异常映射到HTTP状态代码。 哪种状态代码不适合本文中的哪种情况&…

kali中常用的ctf工具

exiftool:查看图片的exif信息。 pngcheck:修复被破坏的png图片 pngtools:深入研究png文件的数据 steganographic&#xff1a;用来提取图片中的隐藏信息 stegsolve.jar:kali中没有该工具&#xff0c;但是可以自己下 gimp:提供了转换各类图像文件可视化数据的功能&#xff0c;还可…

linux将所有文件生成lst_Linux自定义repo文件

repo文件简介repo文件是CentOS中yum源(软件仓库)的配置文件&#xff0c;通常一个repo文件定义了一个或者多个软件仓库的细节内容&#xff0c;例如我们将从哪里下载需要安装或者升级的软件包&#xff0c;repo文件中的设置内容将被yum读取和应用yum原理YUM的工作原理并不复杂&…

使用JUnit规则测试预期的异常

这篇文章展示了如何使用JUnit测试预期的异常。 让我们从我们要测试的以下类开始&#xff1a; public class Person {private final String name;private final int age;/*** Creates a person with the specified name and age.** param name the name* param age the age* th…

CSS盒子模型之详解

前言&#xff1a; 盒子模型是css中最核心的基础知识&#xff0c;理解了这个重要的概念才能更好的排版&#xff0c;进行页面布局。一、css盒子模型概念 CSS盒子模型 又称框模型 (Box Model) &#xff0c;包含了元素内容&#xff08;content&#xff09;、内边距&#…

LeetCode的二分查找的练习部分总结

这两天由于工作的原因&#xff0c;一直没有写博客&#xff0c;但是却把LeetCode上面的题目做了不少——二分查找。上面这些题都是这两天写的。现在简单做一个总结。 首先二分查找的思想就是对一个有规律的元素&#xff08;事情&#xff09;进行不断的排除&#xff0c;最后找到符…

在Mac上安装IntelliJ IDEA

在Mac上安装IntelliJ IDEA http://www.jetbrains.com/idea/documentation/ 入门视频 这篇文章旨在介绍如何在Mac系统上安装IntelliJ IDEA&#xff0c;至于IntelliJ IDEA的介绍和使用方法&#xff0c;大家另行查阅&#xff0c;本篇的文章不再详细阐述。 简短解说&#xff0c;I…

mysql sohu_【MySQL中间件之SOHU-DBProxy】

SOHU-DBProxy是由 搜狐 数据库团队开发维护的一个基于MySQL协议的数据中间层项目。它在MySQL官方推出的MySQL-Proxy 0.8.3版本的基础上&#xff0c; 修改了大量bug&#xff0c;添加了很多功能特性。现在已经在sohu的多个业务线上使用DBProxy 兼容 MySQL 协议&#xff0c;可以用…

JavaFX:太空侵略者在175 LOC以下

使用当前版本的API&#xff0c;我对太空侵略者的评价不到175个LOC。 我的API中有很多“功能接口”&#xff0c;可以使用JavaFX 8&#xff08;例如SpriteProvider和CollisionHandler&#xff09;将其转换为Lambda表达式。 这将使代码更好&#xff0c;更短。 我可能还可以通过捆绑…

行内元素,块级元素,各自特点及其相互转化

作为一名小前端&#xff0c;块级元素、行内元素用了几千几万次&#xff0c;除了“块级独占一行&#xff0c;行内不独占”之外&#xff0c;对细节属性的了解十分匮乏&#xff0c;今天做以部分属性的测试和阐述。 一、 对物理属性的支持 元素类别widthheightpaddingmargin是否独…

mysql断开同步并记录位置_数据库同步自动断开问题的处理

堡垒机的实施过程中&#xff0c;因为做了双机&#xff0c;所以要对两台堡垒机进行数据库的主从同步和HA配置。在部署完mysql主从同步以后&#xff0c;发现同步会有中断的现象。中断表现为Slave_IO_Running: YesSlave_SQL_Running: NoReplicate_Do_DB:Replicate_Ignore_DB:Repli…