H5新增的標簽以及屬性


H5的更新加強了瀏覽器的功能,減少了插件的使用(Flash)。

video 表示一段視頻並提供播放的用戶界面
audio 表示音頻
canvas 表示位圖區域

svg 定義矢量圖

time 日期和時間值
mark 高亮的引用文字

還有一些語義化標簽

<header>頭部</header>
<footer>尾部</footer>
<nav>導航欄</nav>
<section>具體的內容</section>
<article>文章</article>
<aside>內容的側邊欄</aside>

<figure> <img src="" alt=""></figure>用作文檔中插圖的圖像,如果要添加標題的話得使用<figcaption></figcaption>並且要必須要放在標簽里面

如:

<figure> <img src="" alt="">

<figcaption>這是一張圖片</figcaption>

</figure>

<mark>mark標簽</mark> 高亮的引用文字

<progress value="0.5"></progress>進度欄標簽 value值代表進度,0-1

 

並且添加了一些新的表單控件

email:必須輸入郵件;
url:必須輸入url地址;
number:必須輸入數值;
range:一個滑動欄,並且可以設置最大以及最小值
如:<input type="range" name="range" min="10" max="60">
date:選取日、月、年
month:選取月、年
week:選取周和年
time:選取時間(小時和分鍾)
datetime-local:選取時間、日、月、年(本地時間)
search:搜索框
color:顏色
 
以及一些新的屬性:
contenteditable="true" 使得文件可以編輯,並且這個屬性是可以繼承的。
 autocomplete  設置表單成功提交過的數據,下一次有提示   一般會關閉這個功能
placeholder 提示信息
 required  是否必須填寫
pattern  正則驗證表單內容
multiple 輸入框可以輸入多個值,一般和email控件一起使用
maxlength 最大長度
minlength 最小長度 
step  規定數字間隔
hidden 隱藏 填寫了hidden屬性的標簽會被隱藏
draggable 元素是否能被拖動
 
 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM