<!DOCTYPE HTML>
<html>
<head>
<meta charset="GBK">
<base href="http://www.html5china.com/i/" target="_blank" rel="external nofollow" />
<script type="text/javascript">
function drawCanvas()
{
var canvas=document.getElementById('myCanvas');
var ctx=canvas.getContext('2d');
ctx.fillStyle='#FFF000';
ctx.fillRect(200,0,80,100);
}
</script>
</head>
<body>
<aside>Aside 鐨勫唴瀹規槸鐙珛鐨勫唴瀹癸紝浣嗗簲涓庢枃妗ｅ唴瀹圭浉鍏熾€?lt;/aside>
<article contenteditable='true' dir='rtl' draggable='false'>
<h2>Netscape Is Dead</h2>
AOL has now officially announced that they will end
the development and support of all Netscape browsers.
</article>
The house with the <b>red</b> door
<img src="pic.gif" /><br/>
<bdo dir="rtl">Here is some text</bdo><br/>
姣涙辰涓滆杩囷細
<blockquote>甯濆浗涓諱箟閮芥槸绾歌€佽檸 ... </blockquote><br/>
<button>Click Me!</button><br/>
<canvas id="myCanvas">
your browser does not support the canvas tag
</canvas><br/>
聽<table>
聽 <col style="color:blue" />
聽 <col span="2" style="color:yellow" />
聽 <tr>
聽聽聽 <td>1</td>
聽聽聽 <td>2</td>
聽聽聽 <td>3</td>
聽聽聽 <td>4</td>
聽 </tr>
聽 <tr>
聽聽聽 <td>1</td>
聽聽聽 <td>2</td>
聽聽聽 <td>3</td>
聽聽聽 <td>4</td>
聽 </tr>
</table>
<command type='checkbox' ></command>
<input id="myCar" list="cars" />
<datalist id="cars">
聽 <option value="BMW">
聽 <option value="Ford">
聽 <option value="Volvo">
</datalist>
<dl>
聽 <dt>Coffee</dt>
聽 <dd>Black hot drink</dd>
聽 <dt>Milk</dt>
聽 <dd>White cold drink</dd>
</dl>
a dozen is <del>21</del> 12 pieces
<fieldset>
<legend><details title='sadasfsdf'>鍋ュ悍淇℃伅锛?lt;/details></legend>
<form>
<label>韬珮锛?lt;input type="text" /></label>
<label>浣撻噸锛?lt;input type="text" /></label>
</form>
</fieldset>
<dialog>
聽 <dt>鑰佸笀</dt>
聽 <dd>2+2 绛変簬锛?lt;/dd>
聽 <dt>瀛︾敓</dt>
聽 <dd>4</dd>
聽 <dt>鑰佸笀</dt>
聽 <dd>绛斿浜嗭紒</dd>
</dialog>
<hr>
<p>The <i class="taxonomy">Felis silvestris catus</i> is cute.</p>
<p>The term <i>prose content</i> is defined above.</p>
<p>There is a certain <i >je ne sais quoi</i> in the air.</p>
<img src="smile.gif" alt="smile" />
<ol>
聽聽 <li>Coffee</li>
聽聽 <li>Tea</li>
</ol>
<ol>
聽聽 <li value="8">Coffee</li>
聽聽 <li>Tea</li>
</ol>
sdfasfaf<m>eeeeee</m>sadasdfdds<br/>
<menu>
<li><input type="checkbox" />Red</li>
<li><input type="checkbox" />blue</li>
</menu>
<meter min="0" max="20" value="5" >5</meter><br />
<p>绌洪棿鍓╀綑澶у皬锛?lt;meter min="0" max="1024" value="600">600/1024</meter>600/1024 GB</p><br />
<nav>
聽 <a href="index.htm" target="_blank" rel="external nofollow" >HTML5涓枃缃?lt;/a>
聽 <a href="html5_meter.htm" target="_blank" rel="external nofollow" >涓婁竴椤?lt;/a>
聽 <a href="html5_nest.htm" target="_blank" rel="external nofollow" >涓嬩竴椤?lt;/a>
</nav>
<select>
聽聽聽聽聽 <optgroup label="Swedish Cars">
聽聽聽聽聽 <option value ="volvo">Volvo</option>
聽聽聽聽聽 <option value ="saab">Saab</option>
聽聽聽聽聽 </optgroup>
聽聽聽聽聽 <optgroup label="German Cars">
聽聽聽聽聽 <option value ="mercedes">Mercedes</option>
聽聽聽聽聽 <option value ="audi">Audi</option>
聽聽聽聽聽 </optgroup>
</select>
<object id="Slider1" width="100" height="50">
聽 <param name="BorderStyle" value="1" />
聽 <param name="MousePointer" value="0" />
聽 <param name="Enabled" value="1" />
聽 <param name="Min" value="0" />
聽 <param name="Max" value="10" />
</object>
<progress value='50' max='100'></progress>
杩欐槸涓€涓煭鐨勫紩鐢細
<q>杩欐槸涓€涓煭鐨勫紩鐢細</q><br/>
asdfasdfasdfasdf<section>yyyyyy</section>rrrr<br/>
杩欐鏂囨湰鍖呭惈 <sub>涓嬫爣</sub>
聽聽聽聽 聽
杩欐鏂囨湰鍖呭惈 <sup>涓婃爣</sup>
<textarea rows="3" cols="30">
杩欓噷鏄枃鏈煙涓殑鏂囨湰 ... ... ... ...
</textarea><br/>
<table>
聽 <tr>
聽聽聽 <th>Header 1</th>
聽聽聽 <th>Header 2</th>
聽 </tr>
聽 <tr>
聽聽聽 <td>Cell A</td>
聽聽聽 <td>Cell B</td>
聽 </tr>
聽 鎴戜滑鍦ㄦ瘡澶╂棭涓?<time>9:00</time> 寮€濮嬭惀涓氥€?
鎴戝湪 <time datetime="2008-02-14">鎯呬漢鑺?lt;/time> 鏈変釜绾︿細銆?
<ul>
聽聽 <li>Coffee</li>
聽聽 <li>Tea</li>
</ul>
</body>
</html>
![HTML5Canvas 酷炫效果[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)