html5新标签应用示例一
来源：互联网 发布：斗地主出牌算法 编辑：程序博客网 时间：2024/06/05 07:18
<!doctype html>
<html>
<head>
<style>
/*
*{ border:1px solid red;height:20px;}
*/
header{height:120px;background:#ABCDEF;}
nav{background: #ff9900;height:30px;margin-top:80px;}
nav ul li{width:100px;height:30px;float:left;line-height:30px;}
div{margin-top:10px;height:1000px; }
section{height:1000px; width:70%;float:left;background:#ABCDEF;}
article{background:#ff9900; width:200px; margin:auto;text-align:center;}
aside{height:1000px; width:28%;float:right;background:#ABCDEF;}
footer{ height:100px;background:#ABCDEF;clear:both;margin-top:10px;}
</style>
</head>
<body>
<header>
<p>这是一个header标签
</p>
<nav>
<ul>
<li>首页
</li>
<li>企业
</li>
<li>论坛
</li>
<li>商城
</li>
<li>首页
</li>
</ul>
</nav>
</header>
<div>
<section>
<p>这是一个section标签</p>
<article>
这是一个article标签
<h2>
春晓
</h2>
春眼不觉晓
<br>
处处蚊子咬
<br>打上敌故畏
<br>不知死多少
</article>
<hr>
<article>
这是一个article标签
<h2>
春晓
</h2>
春眼不觉晓
<br>
处处蚊子咬
<br>
打上敌故畏
<br>
不知死多少
<br>
</article>
<hr>
<figure>
<figcaption>
UFO
</figcaption>
<p>UFO是啥？
</p>
</figure>
<figure>
<dt>
DTS
</dt>
<p>DTS
</p>
</figure>
<dialog>
<dt>
中国人民解放军1
</dt>
<dd>
中国人民解放军2
</dd>
<dt>
中国人民解放军3
</dt>
<dd>
中国人民解放军4
</dd>
</dialog>
<hr/>
IE不支付ruby标签
<ruby>
钟zhong
</ruby>
<hr/>
目前只有 Chrome 和 Safari 6 支持 details标签。
<details>
<dt>这是一个问题 </dt>
<dd>中国共产党成立于哪一年？</dd>
<dt>中国人民解放军成立于哪一年？ </dt>
<dd>
这还不知道？
</dd>
</details>
中国<mark>人民</mark>解放军
<hr/>
<menu >
<li>AAA
</li>
<li>BBB
</li>
</menu>
<hr/>
<span contextmenu="menu1">右击我试试
右键单击我试试（IE不支持，只有火狐支持此标签。）
</span>
<menu type="context" id="menu1">
<menuitem label="菜单" onclick="alert('这是菜单二')" icon="https://www.baidu.com/img/bd_logo1.png">
ADCBEF
</menuitem>
</menu>
<hr/>
meter标签IE不支持，只有火狐支持此标签(设置low和high后，进度条颜色会发生变化)
<meter min="0" max="10" value="7" LOW="3" High="6"></meter>
<hr/>
<progress max="100" value="0" id="pro1">
</progress>
<script>
var pro=document.getElementById('pro1');
setInterval(
function()
{
pro.value+=10;
},1000);
</script>
</section>
<aside>
<p>
这是一个aside标签
</p>
<hgroup>
<h3>
中国人民解放军5
</h3>
<h3>
中国人民解放军6
</h3>
<h3>
中国人民解放军7
</h3>
<h3>
中国人民解放军8
</h3>
</hgroup>
</aside>
</div>
<footer>这是一个footer标签
<hr/>
<small>法律条文
</small>
<small>联系我们
</small>
<small>联系我们
</small>
<small>联系我们
</small>
</footer>
</body>
</html>
- html5新标签应用示例一
- HTML5新标签一
- 关于html5 新标签应用
- HTML5学习---新标签(一)
- html5新标签的具体应用
- 关于html5<input>标签新属性的应用
- 深入了解html5新标签应用及感悟
- HTML5新标签
- HTML5 中的新标签
- HTML5 新标签
- HTML5 新标签
- HTML5新标签
- HTML5新标签
- html5新标签
- HTML5 新标签
- Html5新标签注解
- html5新标签
- HTML5 中的新标签
- Android代码混淆需要知道以及注意的事情
- 经典SQL语句大全
- FreeGLUT Tips: Resolve compile issue: error LNK1104: cannot open file 'freeglutd.lib'
- 值类型和引用类型的区别
- openssl升级到1.0.1g的过程
- html5新标签应用示例一
- AndroidManifest.xml——activity（三）
- c#中volatile关键字的作用(zz)
- iOS中的模糊效果
- 个人链接草稿
- 新gre考试写作中以疑问句开头
- opencl开发环境配置
- Java工程集成log4J 1.x
- Git:代码冲突常见解决方法
