? ?HTML5是HTML的最新版本,HTML又稱為超文本語言瘟栖。如今幾乎所有的智能手機(jī)和平板電腦都能支持HTML5横蜒。HTML5的主要目的是用來開發(fā)更優(yōu)秀、更高效的Web應(yīng)用右核,它是在開放Web標(biāo)準(zhǔn)下開發(fā)的API和規(guī)范的慧脱。對于iOS和Android設(shè)備,都能很好的支持HTML5贺喝,因?yàn)樗鼈冞\(yùn)行的瀏覽器Safari菱鸥、Chrome都基于WebKit,WebKit對HTML5有相當(dāng)出色的支持躏鱼。
Web應(yīng)用
? ?Web應(yīng)用是指與桌面應(yīng)用相似的web應(yīng)用(Word氮采、IE、Web瀏覽器)染苛,簡而言之鹊漠,Web應(yīng)用就是不直接在計(jì)算機(jī)上打開,而是通過Web瀏覽器來運(yùn)行。使用HTML5為iOS和Android設(shè)計(jì)Web頁面的好處是在未來的設(shè)備上可以繼續(xù)使用躯概。
HTML5中的新標(biāo)簽
<article>-文檔或站點(diǎn)的一個獨(dú)立部分
<aside>-頁面或站點(diǎn)主題之外的內(nèi)容
<figcaption>-figure元素的標(biāo)題
<figure>-獨(dú)立于文本流之外的一段流內(nèi)容(圖形登钥、圖表)
<footer>-文檔或章節(jié)的頁腳
<header>-文檔或標(biāo)題的頁眉
<hgroup>-標(biāo)題組
<nav>-導(dǎo)航
<section>-章節(jié)部分
以下是一小段代碼:
在許多Web設(shè)計(jì)中,<div id ?= "header">楞陷,在HTML5中將寫成<header>怔鳖,還有一些其他不同變化。
HTML5新的多媒體標(biāo)簽
<audio>-內(nèi)嵌音頻文件
<canvas>-內(nèi)嵌動態(tài)圖形
<embed>-增添其他不包含特定H5元素的技術(shù)
<source>-內(nèi)嵌音頻及視頻的源文件
<track>-內(nèi)嵌音頻及視頻的輔助多媒體軌道
<video>-內(nèi)嵌視頻文件
HTML5 的新屬性
onabort-操作終止時觸發(fā)
onbeforeonload固蛾、onbeforeonunload结执、onunload-在某一元素記載或卸載之前或同時觸發(fā)
oncontextmenu-打開菜單時觸發(fā)
ondrag、ondragend艾凯、ondragenter献幔、ongragleave、ongragstart趾诗、ongrop-發(fā)生拖拽時觸發(fā)
onerror及onmessage-錯誤或彈出信息時觸發(fā)
onscroll-用戶滾動瀏覽器滾動條時觸發(fā)
onresize-調(diào)整元素大小時觸發(fā)
HTML5擁有與視頻蜡感、音頻、Web應(yīng)用程序恃泪、編輯頁面內(nèi)容郑兴、拖拽以及展示瀏覽器歷史等功能相關(guān)的API,另外H5開放Web還提供于地理定位贝乎、Web存儲及離線Web應(yīng)用程序的API情连,這些都非常適合在移動設(shè)備上使用。
用CSS3設(shè)計(jì)移動頁面樣式
? CSS(層疊樣式表)览效,是移動Web開發(fā)中的一個重要組成部分却舀,CSS用于定義HTML文檔的外觀,Web頁面顯示或特定移動設(shè)備來定制HTML樣式锤灿。創(chuàng)建CSS樣式表挽拔,CSS由附加了樣式屬性的一個或者多個選擇器組成。例如在更改段落的文本顏色時但校,可以寫為:
p {
color:red螃诅;
}
p為選擇器,樣式屬性為color:red状囱。如果要加入第二個選擇器州刽,需要逗號隔開
p, .redText }
? ? ? ?color: red
}
樣式表附加到Web頁面的方法:
1浪箭、內(nèi)聯(lián)在標(biāo)簽中
2穗椅、內(nèi)嵌于HTML開頭
3、放在一個獨(dú)立文檔作為樣式表
內(nèi)聯(lián):
將單一段落的文本顏色定位為紅色
<p style = "color : red;">
內(nèi)聯(lián)的缺點(diǎn)是只能定義所在標(biāo)簽的樣式奶栖,如果要講所有段落都定義為紅色時匹表,需要就愛那個樣式屬性添加在每個段落门坷。
內(nèi)嵌:
內(nèi)嵌樣式表位于文檔的<head>標(biāo)簽中,使用<style>標(biāo)簽袍镀,下面是講所有段落文本設(shè)置為紅色
? 效果如下:
內(nèi)嵌樣式與內(nèi)聯(lián)樣式一樣默蚌,只能影響所處頁面的樣式。如果我們需要將同一樣式作用于其他Web頁面苇羡,需要將它們分別粘貼到每個頁面绸吸,這個時候獨(dú)立的樣式表的好處就體現(xiàn)出來了。
外聯(lián)樣式表
創(chuàng)建外聯(lián)樣式表的步驟:
1.打開一個新文檔
2.編寫樣式表设江,但是要去掉<style>標(biāo)簽
3. ?講該文件保存為擴(kuò)展名為.css的樣式表文件,例如 :style.css?
? 下面的代碼是將段落定義為紅色并包含其他樣式的樣式表
ps:完成樣式表锦茁,要記得講它附加到Web頁面中,在文檔開頭加一個指向樣式表的<link>標(biāo)簽叉存。代碼如下:
<link href = "styles.css" rel="stylesheet">
ps:外聯(lián)樣式表可以提高網(wǎng)站加載速度码俩,如果將所有樣式放在同一個文檔中的外聯(lián)樣式表
學(xué)習(xí)無止境,督促自己不斷前進(jìn)吧歼捏!