<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<header>
<h1>html5头部标签header</h1>
</header>
<hr />
<section>
<article>
<h2>html5内容标签section</h2>
<p>页面的主要内容</p>
</article>
<article>
<h2>html5中新增的结构标签</h2>
<p>section: 可以表达书本的一部分或一章，或者一章内的一节。</p>
<p>herder: 页面主题的头部，并非head标签</p>
<p>footer: 页面的底部（页脚），也可以是一封邮件签名的所在</p>
<p>nav: 到其他页面的链接集合</p>
<p>article: 博文、杂志、文章编汇等中的一篇文章</p>
</article>
<article>
<h2>html5新增的块级标签</h2>
<p>aside: 定义页面内容之外的内容，如侧边栏</p>
<p>figure: 定义媒介内容的分组，以及他们的标题</p>
<p>figcaption: 媒介内容的标题说明</p>
<p>dialog: 定义对话、会话</p>
</article>
<article>
<h2>html5新增的行内元素</h2>
<p>mark: 定义有记号的文本</p>
<p>time: 定义时间、日期</p>
<p>meter: 定义预定义范围内的度量</p>
<p>progress: 定义运行中的速度</p>
</article>
<article>
<h2>html5新增多媒体和交互元素</h2>
<p>video： 定义视频，如电影短片、其他视频</p>
<p>audio: 定义音频，如音乐或者其他音频流</p>
<p>embed: 用来插入各种多媒体，格式可以为：MIDI、WAV、AIFF、AU、MP3等</p>
</article>
<video>
<!-- video标签概述
source: 给媒体指定多个可以选择的文件地址，其属性值有：src(地址)、type(说明媒体类型、格式)、media(说明媒体在何种媒介中使用，默认是所有媒介)
src: 规定要播放的视频路径
poster: 规定视频加载时显示的图像或者用户在点击播放按钮前显示的图像
preload: 用于定义视频是否预加载，其属性值有：none(当页面加载后不载入视屏) 、 metadata(当页面加载后只载入元视频) 、 auto(当页面加载后载入整个视频)
autoplay: 设置视频是否在页面自动播放
loop: 设置视频播放结束后是否循环播放，默认是循环播放
controls: 如果出现这个属性，则像用户显示控件，控制栏包括播放、暂停、播放进度、音量大小等
width height 设置视频的宽高
-->
<acticle>
<video width="300" height="100" autoplay="autoplay" controls="controls">
<source src="XXXX.ogg" type="video/ogg"/>
<source src="GGGG.mp4" type="video/mp4"/>
</acticle>
</video>
<!--audio音频
controls: 在audio标签中，如果不包含controls属性，则播放器不会呈现在页面上
source: 给媒体指定多个可以选择的文件地址，其属性值有：src(地址)、type(说明媒体类型、格式)、media(说明媒体在何种媒介中使用，默认是所有媒介)
-->
<div>
<h1>音乐播放器</h1>
<br/>
<audio controls="controls" autoplay="autoplay">
<source src="img/庄心妍 - 再遇不到你这样的人.mp3" type="audio/mp3"/>
</audio>
</div>
<article>
<h2>HTML5新增的input元素类型</h2>
<p>url： 当input元素中type的属性值为url时，表示文本框只能输入url地址，否则是不能提交的</p>
<p>email: 当type的属性值为email时，在提交表单的时候，会自动验证输入框中的内容是否为email格式</p>
<p>date: 当type的属性值为date时，该输入框只能输入日历形式的日期</p>
<p>time: 当type的属性值为time时，该输入框只能输入时间</p>
<p>datetime: 当type的属性值为datetime,他在提交的时候会对输入的数据进行检查</p>
<form action="html5基础入门.html" method="post">
<input type="email" />
<input type="submit" />
</form>
</article>
</section>
<hr/>
<footer>
<nav>
<ul>
<li>footer标签表示整个页面中的一个内容区块的脚注</li>
<li>nav标签表示导航链接部分</li>
</ul>
</nav>
</footer>
</body>
</html>
浙公网安备 33010602011771号