2018-07-30

HTML5知識點總結

一.新增語義化標簽

<header></header>????頭標簽

<nav></nav>????導航

<article></article>????文章

<section></section>????文檔中的節

<footer></footer>????腳注 ? 底部

<aside></aside>????側邊欄

二.其他標簽

<details>

????????<summary>標題</summary>

????????其他內容

? </details>

<time></time>????????????<time? datetime="日期"></time>

進度條????<progress ? value=""? min=""? max=""? ></progress>

度量衡????<meter? value=""? min=""? max=""? low=""? high=""></meter>

數據列表

<input? list="id值">

<datalist? id="值">

????????<option? value=""></option>

????????<option? value=""></option>

????????。。。。

</datalist>

三.form新增控件

<input type="email"/>????????郵箱 ??

<input type="url"/>????????地址

<input type="number" ? min="" max=""? step=""/>????????數字 ? ? ? step表示步長

<input type="range" min=""? max=""? step=""/>????????滑動條

年月日????<input type="date"/>

年月????<input type="month"/>

年周????<input type="week"/>

時間(時分)????<input type="time"/>

年月日時分(utc時間)??????<input? type="datetime"/>

年月日時分(本地時間)???????<input? type="datetime-local"/>

搜索域 ?? <input? type="search"/>

顏色 ? ? ?? <input ? type="color" ? value="十六進制"/>

電話 ? ? ?? <input ? type="tel"? pattern="\d{11}"/>????????\d數字[0,9] ????{11}重復前一項11次


新增屬性

placeholder ???文本提醒

required ??????必填項

autocomplete ??自動補全 ? ? ? ? 值:1)on ?默認開啟自動補全 ? 2)off ?關閉自動補全

autofocus ?????自動獲取焦點

readonly ??????只讀狀態


四.多媒體

1.音頻

?<audio ? src="音頻路徑"></audio>

兼容

<audio>

????????<source? src="音頻路徑"? type="audio/ogg"></source>

????????<source? src="音頻路徑" ? type="audio/mpeg"></source>

????????....

? ? ?? 你的瀏覽器不支持audio標簽

</audio>

audio屬性:

1)controls ????控件

2)autoplay ????自動播放

3)loop ????????重復播放


2.視頻

<video? src="視頻路徑"></video>

兼容

<video>

? ? ? ?? <source? src="視頻路徑" ? type="video/ogg"></source>

????????<source src="視頻路徑" ?? type="video/mp4"></source>

????????......

????????你的瀏覽器不支持video標簽

</video>

video屬性:

1)controls ????控件

2)autoplay ????自動播放

3)loop ????????重復播放

4)muted ???????靜音

5)poster ????值:“圖片路徑” ? ? 視頻的背景圖片

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 每天筆記下遇到的新知識點 這個是什么標簽?答: 定義無序 HTML 列表,可以嵌套使用。例子 。 定義有序...
    呵呵_e03d閱讀 99評論 0 0
  • 一、CNKI數據庫的檢索和利用 1.1數據庫檢索入口 鹿城教育網和鹿城研訓網均有鏈接 1.2高級檢索 點擊“新版”...
    項丹丹閱讀 617評論 0 1
  • 這次作業靜涵主持,確定主題:優勢。通過尋找自己的特長,來確定自己的人生方向,來管理自己的時間,提高生命的效率,非常...
    江蘇劉志祥閱讀 325評論 5 8
  • 屏蔽負能量的環境真的很重要,做好自己,今天工作的事情確實很多,無暇聊天負面情緒的來源切斷。所以雖然身體很累但心情很...
    AI成長家閱讀 94評論 0 0
  • 只能推給時間
    昕曉_3542閱讀 110評論 0 0