2018-08-23 总结

1.HTML5兼容说明

现如今越来越多的站点开始使用HTML5标签，但是难免有一些客户的电脑系统老旧，浏览器版本比较低，仍然使用IE6-IE8版本的浏览器，HTML5标签对这些老版本的浏览器不支持。如果想让你的网站使用HTML5标签，但是又想兼容低版本的浏览器，下面推荐几种方法，供大家选择。

支持HTML5的各浏览器的最低版本

IE9
Chrome 3.0
Firefox 3.5
safari 3.0
opera 10.5

2.使用html5.js插件兼容（推荐）
引入htnl5.js即可

• 代码如下：
  ie9及以下版本浏览器兼容html5的方法：

  
  
  

  2.png

可以直接将以上代码放置在标签内部，即可完成HTML5标签的兼容。该插件放置在Google code project上提供给大家，是可以直接调用的。

判断IE版本的HTML语句详解，

限定某些浏览器版本才能执行的语句

这时需要判断

• 当当当：

1.png

这样有效是有效,但是用HTML VALIDATOR里,报错,因为这个不符合XHTML 1.1的规范,
如果把ELSE语句去掉,则正确.

4.png

HTML和HTML5的区别

• HTML是一种超文本标记语言

• HTML5是最新的html标准；

• HTML5有新的语义，属性，图形和元素等

• HTML5 提供的新元素和新的 API 简化了 web 应用程序的搭建。

• HTML5默认的字符编码是 UTF-8

• HTML5 - 新特性

新的语义元素，比如

,

,

, and

。

新的表单控件，比如数字、日期、时间、日历和滑块。

强大的图像支持（借由 和

强大的多媒体支持（借由

强大的新 API，比如用本地存储取代 cookie。

前端移动端适配的方法：

第一种是通过javascript修改标签的内容，通过控制不同移动端的缩放比例， 来达成适配

• 步骤1：头部 设置viewport

• 步骤2：
  在页面引入flexible.js适配代码
• 步骤3:
  CSS代码:
  Css尺寸 = 设计稿标注尺寸 / 设计稿横向分辨率 /10
• 注意:
  容器的宽高度单位使用 rem, 但是字体大小font-size 使用 单位 px. 因为考虑到文字的点阵信息,一般文字尺寸多会采用 16px ,20px, 24px,若以rem为单位,会产生 21px,19px这样的值,导致字型难看,甚至黑块

第二种是通过javascript来改变不同移动端元素的font－size 属性， 来达成适配

png格式图片在所有浏览器上都支持吗？

5.png

6.png