HTML5簡介以及新增的一些標籤和屬性

 html5:

新增了一些更有語義的標籤,新增了一些標籤的屬性,新增了一些api(application programming interface),應用程序接口,接口可以認爲是一種協議,繪製圖形,本地存儲,地理位置,不支持ie678。

HTML5新增語義標籤：

<header>頭部</header>
<nav>導航</nav>

<!--區域-->
<section>
    <aside>側邊欄</aside>
    <article>文章</article>
</section>

<footer>底部</footer>

HTML5新增標籤屬性：

        <!--提示文本-->
		<input type="text" placeholder="請輸入..."><br />
		
		<!--禁用-->
		<input type="button" value="提交" disabled="disabled"><br />
		
		
		<form action="##">
			<!--自動獲取焦點-->
			<input type="text" autofocus="autofocus" /><br />
			
			<!--自動補全，off是默認值，配合name屬性使用，name是組名的意思-->
			<input type="text" autocomplete="on" name="sff" /><br />
			
			<!--非空驗證-->
			<input type="text" required="required" /><br />
			<input type="submit" value="提交">
		</form>

HTML5新增下拉菜單：

        <!--新增下拉菜單：用datalist中的id屬性和input中的list屬性關聯-->
		<input type="text" list="one"/>
		<datalist id="one">
			<option>奔馳</option>
			<option>寶馬</option>
			<option>奧迪</option>
			<option value="4">本田</option>
			<option value="5">qq</option>
		</datalist>

HTML5新增音頻標籤：

        <!--
			音頻標籤：audio
			音頻文件路徑標籤:source
			屬性：
			controls  音頻界面
			loop  自動播放
			autoplay  自動播放
			由於音頻標籤對於每個瀏覽器，不是所有的樣式都能識別，此時要對同一個文件引入多個音頻格式
		-->
		<audio controls="controls" loop="loop" autoplay="autoplay">
			<source src="music/yinyue.mp3"></source>
			<source src="music/yinyue.ogg"></source>
		</audio>

HTML5新增視頻標籤：

        <!--
		 視頻標籤的所有用法和音頻一樣
		 -->
		 <!-- 單個文件格式 -->
		<!-- <video src="video/movie.webm" controls="controls" loop="loop" autoplay="autoplay"></video> -->
		<video controls="controls" loop="loop" autoplay="autoplay">
			<source src="video/movie.ogg"></source>
			<source src="video/movie.mp4"></source>
		</video>

HTML5新增表單類型：

        <form action="##">
			<!-- 郵箱類型 -->
			<input type="email"><br>
			<!-- 網址類型 -->
			<input type="url"><br>
			<!-- 數字類型 -->
			<input type="number"><br>
			<!-- 顏色類型 -->
			<input type="color"><br>
			<!-- 搜索類型 -->
			<input type="search"><br>
			<!-- 本地時間類型 -->
			<input type="datetime-local"><br>
			<!-- 月份類型 -->
			<input type="month"><br>
			<!-- 周類型 -->
			<input type="week"><br>
			<!-- 時間類型 -->
			<input type="time"><br>
			<!-- 日期類型 -->
			<input type="date"><br>
			<input type="submit" value="提交">
		</form>