HTML5新特性及應用
阿新 • • 發佈：2018-12-05
1.刪繁就簡
2.新標籤
#結構標籤
#媒體標籤
#表單控制元件標籤
#其他標籤
3.應用展示
#其他標籤
<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<title>HTMl5新特性</title>
<style type="text/css">
</style>
</head>
<body>
<h3>mark標記</h3>
<p>My guitar is <mark>Taylor 314E</mark> </p>
<h3>progress進度條</h3>
<progress max="100" value="80"> <span>80%</span></progress>
<h3>time時間註釋</h3>
<p>釋出時間<time datetime="2013-10-2T09:00Z"pubdate>9:00</time></p> <!--pubdate文章釋出時間 用於搜尋引擎的檢測-->
<h3>ruby中文註釋</h3>
<ruby>
漢 <rt><rp>(</rp>ㄏㄢˋ<rp>)</rp></rt> <!--rt--rp 如果瀏覽器不支援則效果為加上括號-->
</ruby>
<h3>wbr軟換行</h3>
<p>
生存還是毀滅，這是一個問題。
<wbr></wbr>
給鳥兒的翅膀綁上黃金，它便無法飛翔。
</p>
<h3>cavas繪圖板</h3>
<p> 用於繪製圖像（通過指令碼，通常是 JavaScript）。</p>
<h3>menu選單的表單控制元件</h3>
<menu>
<li><input type="checkbox" checked=""/>Red</li>
<li><input type="checkbox" checked="checked"/>blue</li>
</menu>
<h3>detail詳細資訊</h3>
<details open>
<summary>Related website</summary>
<ul>
<li>Baidu</li>
<li>Alibaba</li>
<li>Tencent</li>
<li>Deerwings</li>
</ul>
<h3>datalist預選項</h3>
<input list="browsers"/>
<datalist id="browsers">
<option value="Internet Explorer">
<option value="Firefox">
<option value="Chrome">
<option value="Opera">
<option value="Sa fari">
</datalist>
<h3>keygen加密</h3>
<form action="demo_keygen.asp" method="get">
Username: <input type="text" name="usr_name" />
Encryption: <keygen name="security" />
<input type="submit" />
</form>
<h3>output輸出</h3>
<form action="form_action.asp" method="get" name="sumform">
<output name="sum"></output>
</form>
</body>
</html>
參考連結：http://www.imooc.com.cn/
http://www.w3school.com.cn/