HTML5 & CSS3 内容收集(1)

1. HTML发展历史介绍

2. 浏览器支持

2.1 新增标签支持

在html5 中新增了很多的标签，其中包括8个新增语义结构标签。
header, section, footer, aside, nav, main, article, figure ，但是在IE的一些版本中并不能够有效的支持。

/* 人为的进行一些处理，让代码在ie当中显示正常： */
header, section, footer, aside, nav, main, article, figure　{
    display: block;
}

因为新增的语义结构标签在代码中是一个块级元素，除了块级元素本身的特性以及语义之外没有其他的效果，所以可以简单的将其转换为块级元素，以保证在所有浏览器中正常的显示。

以上的写法并不能够在ie8以下实现样式，如果想要完整的兼容所有浏览器，可以采用Sjoerd Visscher 创建的"shiv"插件来解决问题。对于"shiv"这款插件，可以将文件下载下来直接使用，也可以采用静态库的方式加以使用，例如国内百度静态库：

在实际的应用当中，可以采用条件注释的方式加以引用，如下：

2.2 HTML 条件注释

关于条件注释，应用普遍的是专门针对IE的条件注释，如下：

其中，lt 是修饰，同类型的修饰有以下几个：

• lte：就是Less than or equal to的简写，也就是小于或等于的意思。

• lt ：就是Less than的简写，也就是小于的意思。

• gte：就是Greater than or equal to的简写，也就是大于或等于的意思。

• gt ：就是Greater than的简写，也就是大于的意思。

• ! ：就是不等于的意思，跟javascript里的不等于判断符相同

3. HTML5新增标签与属性

3.1 智能表单

3.1.1 新增表单元素

用于不同类型的输出，比如脚本的计算等等。

     +
     =
    
60

提供一种验证用户的可靠方法，目前被淘汰，虽然部分浏览器可以使用，但是不推荐。
标签规定用于表单的密钥对生成器字段。
当提交表单时，会生成两个键，一个是私钥，一个公钥。
私钥（private key）存储于客户端，公钥（public key）则被发送到服务器。公钥可用于之后验证用户的客户端证书（client certificate）。

    用户名: 
    加密: 

3.1.2　新增input类型

• color 选取颜色

• date 从日期中选取日期

• datetime 定义一个日期和时间控制器 (欧朋和safari支持，不推荐使用)

• datetime-local 选择日期和时间

• email 邮箱

• month 选择月份

• number 包含数值的输入域,也可以使用下面的属性对数值进行限定：

  • max 规定允许最大值

  • min 规定允许最小值

  • step 合法的数字间隔

  • value 默认值

• range 包含一定范围的数值输入域,也可以使用下面的属性对数值进行限定：

  • max 规定允许最大值

  • min 规定允许最小值

  • step 合法的数字间隔

  • value 默认值

• search 搜索域

• tel 电话号码字段 (兼容性差，不推荐)

• time 时间选取

• url 域名

• week 周和年

3.1.3 新增表单属性

form /input 新属性

autocomplete 自动完成功能
Tip：这个属性可能失效的原因：①浏览器不支持 ② form开启但是input关闭或者form关闭但是Input开启。③没有设置name属性
这个属性应用于

form 属性

novalidate 规定在提交表单时不应该验证form 或者input域

input属性

autofocus 域自动地获得焦点

form 属性 规定输入域所属的一个或多个表单

formaction 描述表单提交的URL地址 会覆盖掉form标签的action 属性

formmethod 属性
formmethod 属性定义了表单提交的方式。
formmethod 属性覆盖了

用户 user1: 60 分
 
用户 user2: 80 分
 
用户 user3: 90 分