你好,你的!這個符號有問題,是!英文下的感嘆號。
成都創(chuàng)新互聯(lián)專注于桑植網(wǎng)站建設(shè)服務(wù)及定制,我們擁有豐富的企業(yè)做網(wǎng)站經(jīng)驗。 熱誠為您提供桑植營銷型網(wǎng)站建設(shè),桑植網(wǎng)站制作、桑植網(wǎng)頁設(shè)計、桑植網(wǎng)站官網(wǎng)定制、小程序定制開發(fā)服務(wù),打造桑植網(wǎng)絡(luò)公司原創(chuàng)品牌,更為您提供桑植網(wǎng)站排名全網(wǎng)營銷落地服務(wù)。
!--?這里寫注釋?--
HTML5 新增常用元素
HTML5的聲明為:!DOCTYPE html
它不用再像之前的版本一樣在聲明中引用DTD。DTD(document type definition)定義合法的XML文檔構(gòu)建模塊,它使用一系列合法的元素來定義文檔的結(jié)構(gòu)。在HTML中,DTD規(guī)定了標記語言的規(guī)則,使瀏覽器能正確地呈現(xiàn)內(nèi)容。而HTML5不基于SGML,所以不需要引用DTD。
文檔結(jié)構(gòu)元素
article: 定義可以獨立于內(nèi)容其余部分的完整獨立內(nèi)容塊。
header: 頁面頂部。
nav: 導航欄(邊導航,頁面導,底部導)標簽。
hgroup: 定義多個標題時。
section: 內(nèi)容分塊.可設(shè)置cite屬性。
aside: 側(cè)邊欄,定義和頁面內(nèi)容關(guān)聯(lián)度較低的內(nèi)容——如果被刪除,剩下的內(nèi)容仍然很合理。
figure: 代表一個和文檔有關(guān)的圖例。
figcaption: 代表一個圖例的說明(標題)。
footer: 頁面底部。
dialog:定義對話框。
嵌入元素
video 代表一段視頻 及其視頻文件和字幕,并提供了播放視頻的用戶界面。屬性有:
src
autoplay(控制自動播放)
loop(播放完后是否重新播放)
controls(顯示用戶界面)
width
height
audio 代表一段聲音 ,或音頻流。 標簽內(nèi)的文字會在標簽不被支持時呈現(xiàn)。屬性有:
src
autoplay
loop(播放次數(shù),為-1時循環(huán)播放)
controls
volume(音量)
source 為 video 或 audio 這類媒體元素指定媒體源。屬性有src\type(指定資源的MIME類型)。
track為 video 或 audio 這類媒體元素指定文本軌道(字幕) 。屬性有:
kind(數(shù)據(jù)類型)
src
srclang(track文本數(shù)據(jù)的語言)
label 當列出可用的text tracks時,給瀏覽器使用的text track的標題,這種標題是用戶可讀的。
注意:一個media 元素的任意兩個 track 子元素不能有相同的 kind, srclang, 和 label屬性。
canvas 代表位圖區(qū)域,可以通過腳本在它上面實時呈現(xiàn)圖形,如圖表、游戲繪圖等。
embed 代表一個嵌入的外部資源,如應(yīng)用程序或交互內(nèi)容。屬性有:
width
height
src
type 用于選擇插件實例化的 MIME 類型。
表單元素
meter代表滑動條。顯示實時狀態(tài)。屬性有:
value 當前數(shù)值,如果給定的值不在最小值和最大值之間,它的值就等于它最接近的一端的值。
min 值域的最小邊界值,默認為0
max 值域的最大邊界值,默認為1
low 定義了低值區(qū)間的上限值,當數(shù)值處于low-min或high-max時就會呈現(xiàn)不同的樣式。
high 定義了高值區(qū)間的下限值。
optimum 最優(yōu)值
output代表計算值 。
for 其它影響計算結(jié)果的標簽的ID,可以多個。
form 與當前標簽有關(guān)聯(lián)的form(從屬的表單)。該屬性的值必須是當前文檔內(nèi)的表單元素的ID。如果未指明該屬性,output標簽必須是一個form的后代標簽。該屬性的用處在于可以讓output標簽脫離form標簽,存在于一個網(wǎng)頁文檔的任意位置。
name
form oninput="result.value=parseInt(a.value)+parseInt(b.value)"
input type="range" name="b" value="50" / +
input type="number" name="a" value="10" / =
output name="result"/output
/form
1
2
3
4
5
progress代表進度條,表示任務(wù)過程,屬性有max(任務(wù)總量)\value。
datalist為Input標記定義一個下拉列表,配合option標簽。
其他
details創(chuàng)建一個掛件,僅在被切換成展開狀態(tài)時,它才會顯示內(nèi)含的信息。
summary 是details 元素的子元素,表示其綜述或標題 。
mark代表一段需要被高亮的引用文字。
ruby表示需要被ruby 注釋 標記的文本,如中文漢字和它的拼音。
rt 表示ruby 注釋 ,如中文拼音。
rp 在ruby 注釋兩邊的額外插入文本 ,用于在不支持 ruby 注釋顯示的瀏覽器中提供友好的注釋顯示。
ruby夼rp(/rprtkuang/rtrp)/rp/ruby
1
順便一提,html5刪除了的元素:
純表現(xiàn)的:basefont\big\center\font\s\strike\tt\u
對可用性有負面影響的:frame\frameset\noframes
產(chǎn)生混淆的:acronym\applet\isindex\dir
同時HTML5也對某些元素進行了重定義,改變了它們的語言內(nèi)容但表現(xiàn)不變。如b標簽、i標簽,仍然表示為粗體、斜體,但代表了一段需要被關(guān)注的文字、一段不同性質(zhì)的文字,如技術(shù)術(shù)語、外文短語等。
HTML5屬性變化
新增類型
email \ url \ tel \ number
Datepickers:date \ month \ week(iphone不兼容) \ time \ datetime(UTC格式,安卓、i6+、PC端不兼容) \ datetime-local
針對PC端:range(水平桿,兩邊為min和max) \ search(有內(nèi)容時右邊出現(xiàn)×)\ color(顏色選擇框)
表單屬性
autocomplete屬性:自動完成功能,適用于標簽,以及以下類型的input標簽:text \ search \ url \ tel \ email \ password \ datepickers \ range \ color
form autocomplete="on" //on為打開,Off為關(guān)閉
/form
1
2
autofocus屬性:域自動地獲得焦點,適用于所有的標簽的類型
input autofocus="autofocus"/
1
multiple屬性:規(guī)定輸入域中可選擇多個值,適用于email \ file類型的標簽
input type="file" multiple="multiple" /
1
placeholder屬性:提供一種提示,描述輸入域所期待的值,適用于text \ search \ url \ tel \ email \ password 類型的標簽
input type="text" placeholder="please input your name!"/
1
required屬性:規(guī)定必須在提交之前填寫輸入域,且必須按照相應(yīng)域的格式,如,email域必須要有@、郵件域。適用于text \ search \ url \ tel \ email \ password \ datepickers number \ checkbox \ radio \ file 類型的標簽
input type="email" requried="required" /
1
鏈接屬性
sizes
link rel="icon" href="icon.gif" type="image/gif" sizes="16*16"
//網(wǎng)頁頭部標題的logo,可根據(jù)不同分辨率引用不同的sizes
//type為該圖標的類型,說明該圖標格式為gif
1
2
3
target
base href="......" target="_blank"
1
base標簽寫在head標簽內(nèi)。target屬性控制整個頁面所有超鏈接的默認打開方式(本來是_self),href指定頁面中所有相對鏈接的基準 URL;
超鏈接的屬性
media=“handheld”(表示對設(shè)備進行優(yōu)化,handheld對“手持”設(shè)備進行支持,tv對”電視“設(shè)備進行支持);
hreflang=“zh”(設(shè)置語言,zh表示是簡體中文)
rel=“external”(設(shè)置超鏈接的引用,external表示其為外部鏈接)
其他屬性
script的屬性
defer:加載完腳本后并不執(zhí)行(延遲執(zhí)行),而是等整個頁面加載完之后再執(zhí)行,只有ie兼容
async:對腳本進行異步加載,加載完腳本后立刻執(zhí)行,而不用等整個頁面都加載完才能執(zhí)行。
如果 async=“async”:腳本相對于頁面的其余部分異步地執(zhí)行(當頁面繼續(xù)進行解析時,腳本將被執(zhí)行)
如果不使用 async 且 defer=“defer”:腳本將在頁面完成解析時執(zhí)行
如果既不使用 async 也不使用defer:在瀏覽器繼續(xù)解析頁面之前,立即讀取并執(zhí)行腳本
ol的屬性
start:設(shè)置序號的起始值
reversed:倒敘排列 reversed=“reversed”
html的屬性:manifest
!DOCTYPE HTML
html manifest="demo.appcache"
...
/html
1
2
3
4
通過在頁面中設(shè)置manifest屬性或在manifest文件中加入頁面,可以將此頁面緩存,這樣我們就可以離線訪問,且獲得更快的速度,因為已緩存資源加載得更快。還可以減少服務(wù)器負載。
一旦文件被緩存,則瀏覽器會繼續(xù)展示已緩存的版本,即使修改了服務(wù)器上的文件。為了確保瀏覽器更新緩存,需要更新 manifest 文件。
style的屬性scoped:內(nèi)嵌CSS,可以寫在任何位置,而不止是head。不過這樣會違反我們低耦合的原則。
style scoped
...
style
ctrl+?
HTML注釋:
!--這是單行注釋--
!--
這是多行注釋
這是多行注釋
這是多行注釋
--
擴展資料:
html5基本標簽和快捷鍵使用
一、head標簽:
meta關(guān)鍵字及編碼格式
link圖標以及css
title標題
二、body基本標簽
p(塊級標簽)
h1--h6
hr
dr
blockquote引用
pre預格式
三、快捷鍵的使用:
ctrl+d:刪除單行
ctrl+/: 進行標記
ctrl+shift+/:多行標記
ctrl+alt+↓: 復制
ctrl+alt+l:快速格式
jsp中html5注釋有:
①顯示注釋 !--注釋內(nèi)容 --
②隱示注釋% // 注釋內(nèi)容 % % /* 注釋內(nèi)容 */ %
顯示注釋:打開頁面后,在瀏覽器中查看源代碼時,是可以看到的。
隱示注釋:只能在開發(fā)的時候、jsp頁面看到
我建議是使用第二種“隱示注釋”,注釋一般是給自己看的(能夠清楚知道這段代碼是做什么的),由于不輸出到頁面中,可以減少數(shù)據(jù)量,提升一點的速度。
TML5是什么?
HTML5是指第5代HTML(超文本標記語言),也指用HTML5語言制作的一切數(shù)字產(chǎn)品。
網(wǎng)上的網(wǎng)頁,多數(shù)都是由HTML寫成的。
“超文本”是指頁面內(nèi)可以包含圖片、鏈接,甚至音樂、程序等非文字元素。
而“標記”指的是這些超文本必須由包含屬性的開頭與結(jié)尾標志來標記。
瀏覽器通過解碼HTML,就可以把網(wǎng)頁內(nèi)容顯示出來。
下圖中就很清晰的指出了H5的涵蓋范圍:
HTML5之所以能引發(fā)如此廣泛的效應(yīng),根本在于它不再只是一種標記語言,它為下一代互聯(lián)網(wǎng)提供了全新的框架和平臺,包括提供免插件的音視頻、圖像動畫、本體存儲以及更多酷炫而且重要的功能,并使這些應(yīng)用標準化和開放化,從而使互聯(lián)網(wǎng)也能夠輕松實現(xiàn)類似桌面的應(yīng)用體驗。
html文件里面除了html標簽代碼,可能還會有css和js代碼。
html代碼的注釋用!----,要注釋的內(nèi)容寫在中間,如:
!--div/div--
css代碼的注釋用/**/,如:
/*p{color:red;}*/
js代碼的注釋用//進行單行注釋,/**/進行多行注釋,如:
/*
window.onload?=?function(){
//alert("hehe");
}
*/