HTML5学前热身 实用技巧及应用详解

十四、必要的属性(Required Attribute)

表单允许新的必要属性，用来指定是否需要特殊的input。这取决于你的代码偏好，你可以以下面两种方式之一申明此属性。

<inputtypeinputtype="text"name="someInput"required> 

或者，使用更结构化的方法：

<inputtypeinputtype="text"name="someInput"required="required"> 

两种方法都行。有了这个代码，并且浏览器支持此属性，如果“someInput”文本框是空白，则表单不会被提交。下面是一个简单的例子，我们还将添加占位符属性，因为没有理由不这样做。

<formactionformaction=""method="get"> 
<labelforlabelfor="name">姓名:</label> 
<inputidinputid="name"name="name"type="text"placeholder="zhangxinxu"required="required"/> 
<buttontypebuttontype="submit">提交</button></form> 

如果input里面内容是空白，则表单提交的时候，文本框会高亮显示。

十五、Autofocus属性

同样，HTML 5的解决方案消除了对JavaScript的需要。如果一个特定的输入应该是“选择”，或有重点的，默认情况下，我们现在可以利用自动获取焦点属性。

<inputtypeinputtype="text"name="someInput"placeholder="zhangxinxu"requiredautofocus> 

十六、Audio支持

我们无需再依赖第三方插件区渲染音频。HTML 5提供了元素，我们将不必担心这些插件。就目前，只有最近期的的浏览器提供HTML 5音频支持。在这个时候，它仍然是一个很好的做法提供一些向后兼容的形式。

<audioautoplayaudioautoplay="autoplay"controls="controls"> 
<sourcesrcsourcesrc="file.ogg"/> 
<sourcesrcsourcesrc="file.mp3"/> 
<ahrefahref="file.mp3">Downloadthisfile.</a> 
</audio> 

Mozilla和WebKit的还没有完全相处，当涉及到音频格式，Firefox会希望看到一个.ogg文件，而WebKit的浏览器支持.mp3扩展。这意味着，至少在现在，你应该创建两个版本的音频。

当Safari加载页面时，它不会承认.ogg格式，会跳过它并移动到的MP3版本，因此。请注意IE，每往常一样，不支持这些格式，Opera10和以及以下版本只能使用.wav文件。

十七、Video支持

与元素很类似，在新的浏览器中也存在Video!事实上，就在最近，YouTube宣告了新的HTML 5视频嵌入，当然，是为支持此功能浏览器。因为HTML5的规范没有指定特定的视频编解码器，它留给了浏览器来决定。虽然Safari和InternetExplorer9可以预期支持H.264格式的视频(其中Flash播放器可以播放)，Firefox和Opera是坚持开源Theora和Vorbis格式。因此，当显示HTML 5的视频，您必须提供这两种格式。

<videocontrolspreload> 
<sourcesrcsourcesrc="cohagenPhoneCall.ogv"type="video/ogg;codecs='vorbis,theora'"/> 
<sourcesrcsourcesrc="cohagenPhoneCall.mp4"type="video/mp4;'codecs='avc1.42E01E,mp4a.40.2'"/> 
<p>Yourbrowserisold.<ahrefahref="cohagenPhoneCall.mp4">Downloadthisvideoinstead.</a></p> 
</video> 

还有一个值得注意的一些事情：

1.我们技术上不需要来设置type属性，但是，如果我们不这样做，浏览器不得不自己去寻找类型。

2.不是所有的浏览器理解HTML5视频。在资源元素的下面，我们可以提供一个下载链接，或嵌入视频的Flash版本代替。

3.controls和preload属性就会在下面提及。

4.有方法可以让所有的浏览器支持video标签。