07HTML基礎(chǔ)知識

video標(biāo)簽

?作用: 播放視頻

?格式1:

<video src="">

</video>

video標(biāo)簽的屬性

?src: 告訴video標(biāo)簽需要播放的視頻地址

?autoplay: 告訴video標(biāo)簽是否需要自動(dòng)播放視頻

?controls: 告訴video標(biāo)簽是否需要顯示控制條

?poster: 告訴video標(biāo)簽視頻沒有播放之前顯示的占位圖片

?loop: 告訴video標(biāo)簽循環(huán)播放視頻. 一般用于做廣告視頻

?preload: 告訴video標(biāo)簽預(yù)加載視頻, 但是需要注意preload和autoplay相沖, 如果設(shè)置了autoplay屬性, 那么preload屬性就會失效

?muted:告訴video標(biāo)簽視頻靜音

?width/height: 和img標(biāo)簽中的一模一樣

?格式2

<video>

? ? <source src="" type=""></source>

? ? <source src="" type=""></source>

</video>

第二種格式存在的意義:

?由于視頻數(shù)據(jù)非常非常的重要, 所以五大瀏覽器廠商都不愿意支持別人的視頻格式, 所以導(dǎo)致了沒有一種視頻格式是所有瀏覽器都支持的這個(gè)時(shí)候W3C為了解決這個(gè)問題, 所以推出了第二個(gè)video標(biāo)簽的格式

?ideo標(biāo)簽的第二種格式存在的意義就是為了解決瀏覽器適配問題. video 元素支持三種視頻格式, 我們可以把這三種格式都通過source標(biāo)簽指定給video標(biāo)簽, 那么以后當(dāng)瀏覽器播放視頻時(shí)它就會從這三種中選擇一種自己支持的格式來播放

?注意點(diǎn):

?當(dāng)前通過video標(biāo)簽的第二種格式雖然能夠指定所有瀏覽器都支持的視頻格式, 但是想讓所有瀏覽器都通過video標(biāo)簽播放視頻還有一個(gè)前提條件, 就是瀏覽器必須支持HTML5標(biāo)簽, 否則同樣無法播放

?在過去的一些瀏覽器是不支持HTML5標(biāo)簽的, 所以為了讓過去的一些瀏覽器也能夠通過video標(biāo)簽來播放視頻, 那么我們以后可以通過一個(gè)JS的框架叫做html5media來實(shí)現(xiàn)

audio標(biāo)簽

?作用: 播放音頻

?格式:

<audio src="">

</audio>

<audio>

? ? <source src="" type="">

</audio>

?注意點(diǎn):

?audio標(biāo)簽的使用和video標(biāo)簽的使用基本一樣, video中能夠使用的屬性在audio標(biāo)簽中大部分都能夠使用, 并且功能都一樣. 只不過有3個(gè)屬性不能用, height/width/poster

詳情和概要標(biāo)簽

?作用:利用summary標(biāo)簽來描述概要信息, 利用details標(biāo)簽來描述詳情信息

默認(rèn)情況下是折疊展示, 想看見詳情必須點(diǎn)擊

?格式:

<details>

? ? <summary>概要信息</summary>

? ? 詳情信息

</details>

marquee標(biāo)簽

?作用: 跑馬燈效果

格式:

<marquee>內(nèi)容</marquee>

?屬性:

?direction: 設(shè)置滾動(dòng)方向 left/right/up/down

?scrollamount: 設(shè)置滾動(dòng)速度, 值越大就越快

?loop: 設(shè)置滾動(dòng)次數(shù), 默認(rèn)是-1, 也就是無限滾動(dòng)

?behavior: 設(shè)置滾動(dòng)類型 slide滾動(dòng)到邊界就停止, alternate滾動(dòng)到邊界就彈回

?注意點(diǎn):

?marquee標(biāo)簽不是W3C推薦的標(biāo)簽, 在W3C官方文檔中也無法查詢這個(gè)標(biāo)簽, 但是各大瀏覽器對這個(gè)標(biāo)簽的支持非常好

HTML中被廢棄的標(biāo)簽

-- 由于HTML現(xiàn)在只負(fù)責(zé)語義而不負(fù)責(zé)樣式.但是HTML一開始有一部分標(biāo)簽連樣式也包攬了, 所以這部分標(biāo)簽都被廢棄了

- b消约、u集峦、i、s

- 以上標(biāo)簽自己帶有樣式, 有濃厚的樣式作用, 今后一般都只作為CSS鉤子使用

- 原則: 不到萬不得已,切記不要使用如上標(biāo)簽. 大家可以到BAT的網(wǎng)站查看源代碼, 幾乎看不到以上標(biāo)簽

?b(Bold)作用: 將文本字體加粗

?格式:<b>將文本字體加粗</b>

?u(Underlined)作用: 為文本添加下劃線

?格式:<u>為文本添加下劃線</u>

?i(Italic)作用: 顯示斜體文本效果

?格式:<i>顯示斜體文本效果</i>

?s(Strikethrough)作用: 為文本添加刪除線

?格式:<s>為文本添加刪除線</s>

?為了彌補(bǔ) b汉规、u导匣、i才菠、s標(biāo)簽的不足, W3C又推出了一組新的標(biāo)簽, 這些標(biāo)簽在顯示上看似和buis沒什么區(qū)別, 但是在語義上卻有重大區(qū)別

?strong作用: 著重內(nèi)容 ?格式:<strong>著重內(nèi)容</strong>

?ins(Inserted)作用: 新插入的文本 ?格式:<ins>新插入的文本</ins>

?em(Emphasized)作用:強(qiáng)調(diào)內(nèi)容 ?格式:<em>強(qiáng)調(diào)內(nèi)容</em>

?del(Deleted)作用: 已刪除的文本 ?格式:<del>已刪除的文本</del>

HTML實(shí)體

?我們想在頁面上輸出<h1>這些字符,但是HTML認(rèn)為這是一個(gè)標(biāo)簽, 所以如果需要輸出一些特殊的字符需要通過字符實(shí)體來實(shí)現(xiàn)

?lt是英語less than 小于的意思, <可以在頁面上輸出一個(gè)小于符號

?gt是英語greater than 大于的意思, >可以在頁面上輸出一個(gè)大于符號

?html中對空格贡定,縮進(jìn)赋访,換行不敏感,如果同時(shí)出現(xiàn)多個(gè)空格縮進(jìn)或者執(zhí)行缓待,頁面只會把它們當(dāng)作一個(gè)空格來解析

格式:&nbsp;

蚓耽。所以想要在html中輸出空格必須使用來實(shí)現(xiàn), 一個(gè)就代表一個(gè)空格

?html對中文空格敏感, 也就是說可以顯示中文空格, 但是不推薦這樣使用

? nbsp是英語non-breaking spacing, 翻譯為不打斷空格的意思

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市旋炒,隨后出現(xiàn)的幾起案子步悠,更是在濱河造成了極大的恐慌,老刑警劉巖瘫镇,帶你破解...
    沈念sama閱讀 222,104評論 6 515
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件鼎兽,死亡現(xiàn)場離奇詭異,居然都是意外死亡铣除,警方通過查閱死者的電腦和手機(jī)谚咬,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,816評論 3 399
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來通孽,“玉大人序宦,你說我怎么就攤上這事”晨啵” “怎么了互捌?”我有些...
    開封第一講書人閱讀 168,697評論 0 360
  • 文/不壞的土叔 我叫張陵,是天一觀的道長行剂。 經(jīng)常有香客問我秕噪,道長,這世上最難降的妖魔是什么厚宰? 我笑而不...
    開封第一講書人閱讀 59,836評論 1 298
  • 正文 為了忘掉前任腌巾,我火速辦了婚禮遂填,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘澈蝙。我一直安慰自己吓坚,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 68,851評論 6 397
  • 文/花漫 我一把揭開白布灯荧。 她就那樣靜靜地躺著礁击,像睡著了一般。 火紅的嫁衣襯著肌膚如雪逗载。 梳的紋絲不亂的頭發(fā)上哆窿,一...
    開封第一講書人閱讀 52,441評論 1 310
  • 那天,我揣著相機(jī)與錄音厉斟,去河邊找鬼挚躯。 笑死,一個(gè)胖子當(dāng)著我的面吹牛擦秽,可吹牛的內(nèi)容都是我干的码荔。 我是一名探鬼主播,決...
    沈念sama閱讀 40,992評論 3 421
  • 文/蒼蘭香墨 我猛地睜開眼号涯,長吁一口氣:“原來是場噩夢啊……” “哼目胡!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起链快,我...
    開封第一講書人閱讀 39,899評論 0 276
  • 序言:老撾萬榮一對情侶失蹤誉己,失蹤者是張志新(化名)和其女友劉穎,沒想到半個(gè)月后域蜗,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體巨双,經(jīng)...
    沈念sama閱讀 46,457評論 1 318
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,529評論 3 341
  • 正文 我和宋清朗相戀三年霉祸,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了筑累。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 40,664評論 1 352
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡丝蹭,死狀恐怖慢宗,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情奔穿,我是刑警寧澤镜沽,帶...
    沈念sama閱讀 36,346評論 5 350
  • 正文 年R本政府宣布,位于F島的核電站贱田,受9級特大地震影響缅茉,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜男摧,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 42,025評論 3 334
  • 文/蒙蒙 一蔬墩、第九天 我趴在偏房一處隱蔽的房頂上張望译打。 院中可真熱鬧,春花似錦拇颅、人聲如沸奏司。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,511評論 0 24
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽结澄。三九已至,卻和暖如春岸夯,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背们妥。 一陣腳步聲響...
    開封第一講書人閱讀 33,611評論 1 272
  • 我被黑心中介騙來泰國打工猜扮, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人监婶。 一個(gè)月前我還...
    沈念sama閱讀 49,081評論 3 377
  • 正文 我出身青樓旅赢,卻偏偏與公主長得像,于是被迫代替她去往敵國和親惑惶。 傳聞我的和親對象是個(gè)殘疾皇子煮盼,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,675評論 2 359

推薦閱讀更多精彩內(nèi)容