HTML标准，是随着时代发展的不断变化的，在不同的时期它们有了新的目标与意义。
——ZackBee 兼容问题是历史遗留问题（有一种谈历史的感觉），主要谈的是对HTML5标准的支持。HTML4.01标准的思想是将将结构与表现进行分离，而HTML5标准的思想是什么呢？是将标签语义化、内容丰富化、接口多样化（个人观点）。在PC端考虑兼容性，主要就是对于IE家族低版本浏览器的兼容了。对于HTML4.01标准的内容，从IE6开始就支持的比较不错（只能说比较不错，还是有bug的），到了HTML5，是从IE9开始支持部分，IE9完成的基本支持是语义化的标签（比如section，artical等这样用来表示语义的），以及媒体资源（audio，video）这样的，对于CSS3的支持也比较有限。IE9对于交互方面的标签以及属性支持不足，到了IE10，一切都变的好了起来（对于web开发者真是泪流满面）。了解了HTML4.01以及HTML5的革命任务，以及IE9到IE11之间的变化，对于浏览器兼容性的理解与记忆就会容易许多。下面列出我对浏览器支持的分类。HTML
HTML标签
语义化标签(以下是IE9开始支持的标签，还有些原本就支持，HTML5标准添加了语义的标签没有列出来)
、
资源类标签(从IE9开始支持)
资源类标签（从IE10开始支持）
特别样式类标签（从IE10开始支持）
交互类标签（从IE10开始支持）
HTML属性
概述：大多数涉及到样式如align、背景颜色的属性都被删除了。（表现与结构分离的思想）绝大多数标签只有全局属性。
全局属性（从IE10开始支持）
spellcheck（caniuse.com上面说从10开始，mdn上面写的一直支持）
全局属性（从IE11开始支持）
data-*（完全支持，从6开始部分支持）
audio、video的属性（从IE9开始支持）
autoplay、controls、loop、preload、src、poster（video）
外部资源属性
sizes、srcset（ms系浏览器均未实现，适用于Retina高清屏幕技术）
表单相关的属性（我定义为交互性属性，IE10+支持）
【autofocus、form、formaction、formmethod、formenctype、formnovalidate、 formtarget】（适用于一般表单元素） 【input的各种属性值】
CSS
选择器
基本选择器
元素选择器 elementname(元素名称) 类选择器 .classname(类名) ID选择器 #idname(标志名)
以上三种选择器支持良好 。
通配选择器 * ns|* *|* 属性选择器 [属性=值]
以上两种从IE7开始基本支持，IE9开始支持良好。
组合选择器
相邻兄弟选择器 A + B 普通兄弟选择器 A ~ B 子选择器 A > B 后代选择器 A B
以上选择器从IE7开始支持良好，后代选择器一直支持。
伪元素
概述：早期的伪元素与伪类并没有区分开（CSS3之前的——对应IE9），IE浏览器均使用单分号表示伪元素。下述伪元素默认IE9以后实现：：支持
::after、::before在IE8实现单冒号：支持。 ::first-letter、::first-line从IE5.5开始单冒号支持。 ::selection从IE9开始支持。
也可以看出，在早期主要需求是文本内容样式的基本实现，所以::first-letter、::first-line支持得比较早。
伪类
IE8-：
：active（IE4支持a，8支持所有）、：first-child、：focus、：hover、：lang、：last-child ：link、：right、：visited（IE8良好支持，3.5基本支持）
IE9：
：checked、：disabled、：empty、：enabled、：first-of-type、 ：indeterminate（仅checkbox）、：last-type、：not（）（支持一般用法）、：nth-child(an +b)、：nth-last-child、：nth-last-of-type、：nth-of-type、：only-child、：:only-of- type 、：root、：target
IE10:
：indeterminate(实现progress)、：invalid、：:optional：required、：valid
IE11：
：fullscreen
总结就是IE8及之前的版本，对伪类的实现并不多，基本上都是关于链接的（：hover、：visited、：
link）扩展成对所有元素可以选择，以及子元素最基本的第一个、最后一个的选择。
到了IE9，伪类的类型多了起来，多数是对于一般表单元素的描述的伪类，以及形形色色的子元素的选
择器。
而IE10，从HTML的标签就能看出来，多了很多与交互有关的标签与属性，所以伪类的选择器也是相关
方面的,比如验证表单是否有效等。（它支持的：indeterminate(实现progress)、
： invalid、：:optional：#### required、：valid，这几个伪元素都是表单相关的）
属性（格式为：属性【值、特性】得到支持）
IE9：
background-attachment的local属性、background-clip、background-image【多背景、SVG背景】 background-clip、background-origin、background-position【多背景、四个方向的偏移】、 background-repeat【多背景、双值语法、round（chrome未实现）】、background-size、 border-bottom-left-radius等、box-shadow、cursor【none】，font-stretch,opacity(IE4~8支 持用不标准的filterhack)、pointer-events（只能SVG）、transform（+ms，基础支持）、 writing-mode（+ms）
IE10：
flexbox相关属性（但不标准）、animation（标准支持，其他浏览器的低版本需要加前缀） 、backface-visibility 、breaker-xxxx（其他浏览器均未实现）、column相关属性、hyphens（- ms）@viewport相关属性(+ms)、gradient相关属性、scroll-snap-type（+ms，但 是chrome到62都不支持）text-shadow（原以为和box-shadow一样会是IE9开始支持，没想到是 IE10）、touch-action（基础支持，+ms）、transform相关（3d支持，+ms（但是很奇怪transform- origin却不用+ms））、transition相关、writing-mode(+ms部分支持)
IE11：
flexbox相关属性（标准）、all、border-image相关属性（border-image-repeat未实现） 、caret-color、display【flex相关】、pointer-events（任意元素）、text-combine-upright （+ms）、touch-action（基础支持）、transform-style
总结：IE9主要多了对于多背景方面的支持，对变换（transform的基础支持），但是并没有对CSS动画
有任何支持。IE10增加了对布局相关的支持（column，flex），对动画、过度（我习惯把过度归类为
动画）的支持较良好（transition、animation）（对视觉效果的实现更好），以及与交互相关的属
性。IE11将支持的属性标准化（去掉了一些ms前缀），以及让文字的表现更国际化（让HTML5成为世界
的标准）
属性的数据类型
IE9：
（Opera完全未实现，Safari不支持turn）、 【ch、rem、vh、vw、vmin（IE 实现为vm）】、 【hsl、rgba（）、hsla（）、currentColor、transparent（IE7、8只 支持background、border为transparent）】、 、 、
IE10：
【-ms
】、transform-function（3d支持）
IE11：
【rebeccapurple】
函数
IE9：
attr（）、calc（）IE10：
linear-gradient（）【background-image（之前实现了在border-radius以及上的实 现）】
规则
IE9:
@meadia[Media features],@namespace
IE10：
@viewport（+ms）