html

html version history

1991
1993 HTML+
1995 HTML-2.0
1997 HTML-3.2
1999 HTML-4.01
2000 XHTML-1.0
2012 HTML5
2013 XHTML5

全局属性

class , id , style , title ,

label

multi media

HTML5

document —> Element(tag)
html have 2 parsing modes: content-type: text/html text/xml+xhtml
xhtml5: the html5 xml syntax

html structuring

main header nav footer article aside section figure

Section element spit document into section or chunks.
Each section element may contain its own header or footer.

complete self-contained reusable part

define segment that are neither …
div vs section: section is more semantic . use div for those rare instance when other semantically-relevant tag dosen’t exist.

带说明的图片 for a chart or diagram

for readmore

html5 form

polyfills: provide facilities that are not build into web browser.


application/x-www-form-urlencoded this is the default format.
enctype=”multipart/form-data”. for upload-file.

multi-media

audio & video
ffmpeg: a tool ,command line to transcode video .

canvas WEBGL svg


image/svg+xml
snap svg from adobe is a free open-source tool for generating interactive svg.

offline app

window.navigator.online
window.navigator.offline
capture bubble
check connecxtivity with xmlHttpRequest .

localStorage , IndexDB

cache Mainfest syntax
section: cache network fallback setting

http request performance better than cookie
protect cross-site scripting attacks
document.form[]
localStorage key and values are string
localStorage[‘foo’]=’bar’ == localStorage.foo=’bar’
localStorage.key() localStorage.length
localStorage.clear
json.stringify()

indexDB

web sql , indexdb 分叉
PouchDB
synchronous asychronous

html5-api

web-workers Geolocation server-sent-event web-socket-api cross-document message

new Worker(‘..js-uri’)
uri must have some origin as parent.

cross-document-message

window.postMessage()
data origin source


--Write by Marcustar,关关雎鸠,在河之洲
目录
Download 相册