3.html_gml标记语言的发明者-CSDN博客

本文链接：https://blog.csdn.net/qq_43148818/article/details/113261775

html

历史演变
	在20世纪60年代，IBM公司的人员研究得出：要提高系统的移植性，
	必须采用一种通用的文档格式，这种文档格式必须遵守特定的规则。
	通过这一原则在1969年IBM公司创建了GML（Generalized Markup Language，通用标记语言）。
	后来GML经过不断的发展，在1986年经IOS批准为国际标准IOS8897，
	并称作SGML（Standard Generalized Markup Language，标准通用标记语言）。
	制定SGML的基本思想是将文档的内容和样式分开。一个SGML文件通常分三个层次：结构、内容、样式。
	在实现SGML文档时，一般三个部分构成：
	 （1）SGML声明(SGML Declaration)、 //用以告诉SGML分析器采用何种字符集分析SGML文件
	 （2）文档类型定义(Document Type Definition)、//用以声明文档的结构与语法参数。
	 （3）文档实例(Document Instance)。//文档的内容
	在后来由Web的发明者 Tim Berners-Lee和同事 Daniel W. Connolly于1990年创立了HTML标记语言，
	HTML标记语言是对国际SGML标准的应用，在使用电子文档时采用HTML标记语言的某种规则书写文件，然后可以通过浏览器来识别，
	由浏览器将HTML文件'翻译'成人们能看懂的信息。(即现在的网页)
	HTML的出现使得电子文件的国际标准SGML（IOS8897）得到实现和应用，但HTML本身存在着很大的局限性。
	人们则再次改造SGML来适应网络需求，在1998年2月W3C（万维网联盟）公布了XML1.0，从此XML（Extensible Markup Language，可扩展标记语言）诞生了。
	同时W3C在2000年底，在HTML4.0的基础上公布了XHTML1.0（eXtensible HyperText Markup Language，可扩展超文本标记语言），XHTML则是一个比HTML更加严谨更纯洁的HTML。
	之后HTML不断发展，在2008年在HTML4.01的基础上正式发布了HTML5，到2012年W3C推出了稳定的HTNL5的版本。

<!doctype html>  --文档类型

为了指示浏览器对于页面使用哪一个版本进行编写HTML，链接了不同版本的HTML的编写规则。（此处为版本HTML5）

<html></html>  --根元素

根元素，包含整个页面的所有元素。

<head></head>  --页面头部元素

其包含的元素为浏览器的各种声明，其内容主要是为浏览器提供，用户一般不可见。

<body></body>  --页面主体元素

放置用户可见的内容以及脚本。

<head>元素中一般放置的元素

```
 <title></title> --页面标题标签
```

<meta /> -- 提供页面的元信息

<meta />的属性

content  = ['value']   --定义与name、http-equiv属性相关的元信息

http-equiv = ['value']  --将content属性的值关联到http请求头中

http-equiv 的值(value)

 content-type  --服务器响应的文档类型
 expires       --服务器设置的Cookie过期时间
 refresh       --自动刷新当前页面
 set-cookie    --cookie相关设置

name = ['value']     --将content的属性值关联到一个name值

name的值(value)

auther       --标注网站作者
keywords     --标注网站关键字
description  --标注网站描述
viewport     --为移动设备添加content参数

 charset = 'utf-8'   --申明文档的编码

<link />        --大多用作引入CSS样式表，ICON图标

<link />的属性

href = 'url'     --链接文件的路径`

rel = ['value']  --描述被链接文档与当前文档的关系，为当前文档提供的功能

rel的值

icon                                --指定href引入的文件为ICON图标
stylesheets                         --指定href引入的文件为样式表
prefetch/DNS-prefetch/preload       --指定href引入的文件为预加载文件
type                                --指定href引入的文件的文档类型

<style></style>     --用于为各种标签元素定义样式信息

<script></script>   --书写JS脚本、引入JS脚本

<script>元素的属性

 asgnc             --指定异步执行脚本
 defer             --指定页面完成解析时执行脚本(延迟执行)
 type              --指定脚本的mime类型
 src               --指定引入脚本的路径

<base />            --为页面中的所用链接规定默认链接

   列：  <base href = '默认URL'  target = '打开方式'>

<body>元素一般放置的元素

h1、h2、h3、h4                     --等标题标签
<p></p>                           --段落标签
<div></div> / <span></span>       --文档节
<img src= 'URL'/>                 --图片标签
<a href='URL'></a>                --链接标签
<ul>
    <li></li>                    
</ul>                             --列表标签

<table>
    <tr>
        <th></th>
    </tr>                        
    <tr>
        <td></td>
    </tr>
</table>                          --表格标签

<form>
	<input />
    <textarea></textarea>
    <button></button>
    <select>
        <option></option>
    </select>
    <label></label>
</form>                           --表单标签

<audio></audio>                   --音频标签
<video></video>                   --视频标签
<canvas></canvas>                 --绘图标签

HTML5定义的语义化标签
<nav></nav>
<header></header>
<footer></footer>
<section></section>
<article></article>
<aside></aside>等

<body>中常用元素的重要属性

<img width=''  height='' alt='' src='url'/>

<a href='url' target = '_blank/_self'></a>

<video autoplay='autoplay'    //视频就绪立即播放
       controls='controls'    //向用户提供操作视频播放控件
       loop='loop'            //媒体文件将循环播放
       preload='preload'      //页面加载时加载媒体文件，并预备播放
       src='URL'              //媒体文件路径
 ></video>

<audio></audio>               //属性同<video>
    
<canvas	width=''
        height=''
        id=['ctx']
 ></canvas>
    
<form	action='file'          //表单提交时的动作，提交到指定服务器脚本文件
      	method='post|get'      //表单提交时的HTTP方法
      	accept-charset         //被提交表单的字符集
      	name='value'           //表单的name
 ></form>
    
<input 	name='value'           //表单元素的name属性
       	type='text|password|file|submit|color|radio|checkbox|date|email|url|number'
                               //input元素的类型
       	value='key'            //表单元素提交的值
       	readonly               //只读属性
       	disabled               //禁用表单元素
       	size                   //表单元素输入尺寸
       	placeholder='text'     //表单元素占位内容，预期值提示
       	multiple               //允许type="file"选择多个值
       	required               //是否为必填字段，（布尔类型）
 />

元素常用的全局属性

id                            //规定元素的唯一ID
class                         //规定元素的一个或多个类名
contenteditable               //定义元素内容可编辑
contextmenu                   //规定元素的上下文菜单，用户点击元素时显示
data-*                        //用于存储页面私有定制的数据
draggable                     //定义元素是否可以拖放
lang                          //定义元素内容的语言
style                         //规定元素的行内样式
title                         //规定元素的额外信息（提示信息）
translate                     //规定元素是否翻译内容

HTML中常用的实体

<   &lt;
>   &gt;
''  &quot;
版权(copyright)  &copy;

HTML中常用事件

//window事件
window.onload                 //页面加载之后触发
window.onresize               //浏览器窗口被调整大小时触发
window.onunload               //浏览器窗口关闭时触发

//form表单事件
formELement.onblur            //表单元素失去焦点时触发
formElement.onchange          //表单元素值改变时触发
formElement.onfoucs           //表单元素获得焦点时触发
formElement.onsubmit          //提交表单时触发

//keyboard键盘事件
ele.onkeydown                 //用户按下按键时触发
ele.onkeypress                //用户敲击键盘时触发
ele.onkeyup                   //用户释放按键时触发

//mouse鼠标事件
ele.onclick                   //单击鼠标按键时触发
ele.ondbclick                 //双击鼠标按键时触发
ele.onmousedown               //按下鼠标按键时触发
ele.onmousemove               //移动鼠标时触发
ele.onmouseout                //移出鼠标时触发
ele.onmouseover               //移动到元素内时触发
ele.onmouseup                 //释放鼠标按键时触发