10个HTML5代码片段可在网站制作中随时可用详解(2)-木庄网络博客

当前第2页返回上一页

<video width="640" height="360" controls>
    <source src="VIDEO.MP4"  type="video/mp4" />
    <source src="VIDEO.OGV"  type="video/ogg" />
    <object width="640" height="360" type="application/x-shockwave-flash" data="FLASH.SWF">
        <param name="movie" value="FLASH.SWF" />
        <param name="flashvars" value="controlbar=over&image=POSTER.JPG&file=VIDEO.MP4" />
        <img src="VIDEO.JPG" width="640" height="360" alt="TITLE"
             title="No video playback capabilities, please download the video below" />
    </object>
</video>

打电话和发短信

在移动网页中，有一种快速的方法来建立呼叫和短信链接。下面是一个示例代码，记得收藏在您的代码片段库里。

1 2	`<a` `href="tel:1-408-555-5555">1-408-555-5555</a>` `<a` `href="sms:1-408-555-1212">New SMS Message</a>`

自动完成功能

使用 dataList 元素，HTML5 允许你创建一个输入字段自动完成数据的列表。超级有用的！这里是一个示例代码。

<input name="frameworks" list="frameworks" />
 
<datalist id="frameworks">
    <option value="MooTools">
    <option value="Moobile">
    <option value="Dojo Toolkit">
    <option value="jQuery">
    <option value="YUI">
</datalist>

可下载的文件

HTML5 允许使用 download 属性强制下载文件。这里是一个标准链接到一个可下载的文件。

1 2	`<!-- will download as "expenses.pdf" -->` `<a` `href="/files/adlafjlxjewfasd89asd8f.pdf"` `download="expenses.pdf">Download Your Expense Report</a>`