HTML5标签练习
来源：互联网 发布：网络传送带使用教程 编辑：程序博客网 时间：2024/05/18 13:28
<!DOCTYPE HTML>
<html>
<head>
<meta charset="GBK">
<base href="http://www.html5china.com/i/" />
<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 的内容是独立的内容，但应与文档内容相关。</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'>健康信息：</details></legend>
<form>
<label>身高：<input type="text" /></label>
<label>体重：<input type="text" /></label>
</form>
</fieldset>
<dialog>
<dt>老师</dt>
<dd>2+2 等于？</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 lang="fr">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>空间剩余大小：<meter min="0" max="1024" value="600">600/1024</meter>600/1024 GB</p><br />
<nav>
<a href="index.htm">HTML5中文网</a>
<a href="html5_meter.htm">上一页</a>
<a href="html5_nest.htm">下一页</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">情人节</time> 有个约会。
<ul>
<li>Coffee</li>
<li>Tea</li>
</ul>
</body>
</html>
<html>
<head>
<meta charset="GBK">
<base href="http://www.html5china.com/i/" />
<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 的内容是独立的内容，但应与文档内容相关。</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'>健康信息：</details></legend>
<form>
<label>身高：<input type="text" /></label>
<label>体重：<input type="text" /></label>
</form>
</fieldset>
<dialog>
<dt>老师</dt>
<dd>2+2 等于？</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 lang="fr">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>空间剩余大小：<meter min="0" max="1024" value="600">600/1024</meter>600/1024 GB</p><br />
<nav>
<a href="index.htm">HTML5中文网</a>
<a href="html5_meter.htm">上一页</a>
<a href="html5_nest.htm">下一页</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">情人节</time> 有个约会。
<ul>
<li>Coffee</li>
<li>Tea</li>
</ul>
</body>
</html>
- HTML5标签练习
- HTML5标签练习
- 【垃圾菜鸟笔记】html5 video标签的一点练习
- html5练习
- html5 标签
- HTML5标签
- HTML5标签
- Html5 标签
- html5标签
- HTML5标签
- html5 标签
- html5标签
- html5标签
- html5标签
- HTML5标签
- HTML5 标签
- html5标签
- html5标签
- java实现栈(链表方式)
- maven 配置文件说明
- 中国App如何挑战全球？
- FAT文件系统原理
- 开源软件之七宗罪以及背后的阴谋
- HTML5标签练习
- 鼠标滚动缩放图片效果
- JavaScript与C++对象绑定原理及效率分析
- VS2008 升级，注册码输入
- C++拷贝构造函数（深拷贝，浅拷贝）
- android PreferenceScreen使用笔记
- MongoDB实战-电子书
- iOS7 隐藏status bar
- c/s模式下的文字滚动
