H5 新标签

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
progress{
background: red;
}
datalist{
display: none;
}
</style>

</head>
<body>
<figure>
<img src="img/1.jpg" />

<figcaption>猕猴桃</figcaption>
</figure>

<progress max="100" value="0" id="prog"></progress>

<meter min="0" max="45" value="36" low="35" high="38" optimum="37 ">

</meter>

<input type="text" list="mylist">
<datalist id="mylist">
<option>玄武</option>
<option>老鼠</option>
<option>小狗</option>
<option>小猫</option>
<option>小鸡</option>

</datalist>

<ruby>
犇<rt>ben</rt><rp>ben</rp>
</ruby>

<p><mark>神奇</mark>马克</p>

<time>2016.5.21</time>
<p>H5是每天的晚上 <time>8:30</time>上课</p>

<p>今天是<time datetime="2016.05.25">我爱你</time>节日</p>

<details>
<summary>521</summary>
<p>今天是521(我爱你)节日</p>
</details>

<span oncontextmenu="text">点击我试试</span>
<menu type="context" id="text"></menu>
<menuitem label="521我爱你" icon="img/0.jpg" onclick="alert("你也爱我吗?")"></menuitem>
<script>
var prog = document.getElementById(‘prog‘);
setInterval(function(){
prog.value+=1;

},100);

</script>

</body>

</html>

时间: 2024-10-28 23:03:00

H5 新标签的相关文章

H5新标签(适合新手入门)

H5新标签 文档类型设定 document HTML: sublime 输入 html:4s XHTML: sublime 输入 html:xt HTML5 sublime 输入 html:5 <!DOCTYPE html> 字符设定 <meta http-equiv="charset" content="utf-8">:HTML与XHTML中建议这样去写 <meta charset="utf-8">:HTML

ie8以下不兼容h5新标签的解决方法

HTML5新添了一些语义化标签,他们能让代码语义化更直观易懂,有利于SEO优化.但是此HTML5新标签在IE6/IE7/IE8上并不能识别,需要进行JavaScript处理. 解决思路就是用js创建html5中的新标签,代码如下: <script> (function() { if (! /*@[email protected]*/ 0) return; var e = "abbr, article, aside, audio, canvas, datalist, details,

处理H5新标签方法

语义化 HTML5中加入了更加具有语义化的标签,比如header,nav,footer等,可以为搜索引擎优化,让爬虫能更好地理解网页结构. 但是对于新标签的兼容性不是很好,IE9以下旧版本不支持新的语义化标签 IE8/IE7/IE6支持通过document.方法产生的标签,利用这一特性让这些浏览器支持HTML5新标签. 使用html5shim框架 https://cdn.bootcss.com/html5shiv/3.7.3/html5shiv-printshiv.js 引入即可使用 原文地址:

H5新标签兼容

WordPress中一些主题是用了新增的H5标签 但是这些标签并不兼容IE 678 观察发现 主题引用了js文件 html5shiv.min.js 解决ie9以下浏览器对html5新增标签的不识别,并导致CSS不起作用的问题. 地址: <!--[if lt IE 9]> <script src="//cdn.bootcss.com/respond.js/1.4.2/respond.js"></script> <script src="

h5新标签IE8不兼容怎么办?

<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> body{ clear: both; *zoom:1; } body:after{ content: ''; display: block; c

HTML5新标签的兼容性处理

HTML5新的语义标签尽管有很多的好处,但是在低版本的老IE浏览器中还是存在兼容性问题的,常常让人感到头疼,到底是大胆的使用新标签还是使用传统的大量的DIV无义标签?今天就简单的看看H5新标签的兼容性处理方式. 首先来看一小段简单的代码: HTML代码: <!DOCTYPE html> <html> <head lang="en">     <meta charset="UTF-8">     <title>

HTML5新标签与css3选择器

一.HTML5标签 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>h5新标签</title> 6 <style type="text/css"> 7 img{ 8 width: 200px; 9 height: 200px; 10 } 11 </

html5有哪些新特性?如何处理html5新标签的浏览器兼容问题?如何区分html和html5?

h5新特性: 语义化标签:<hrader></header> .<footer></footer>.<nav></nav>.<section></section>.<article></article>.<aside></aside>.<video></video>.<audio></audio> 新增表单元素:em

通过H5的新标签canvas做出一个时钟的全过程,希望对初学者有帮助

最近学习了H5中的一个新标签canvas并且用它做出了一个时钟,最下面是成品图像,还不错吧,这只是我学习中的一个小demo,做得有点粗糙,但终究是做出来了,以后再写自己的网页主页再做一个好看点放上去.接下来我将和你们分享如何制作这个时钟. 在body中添加canvas标签: <canvas id="myCanvas" width="600px" height="600px" style="border:1px solid #c3c