HTML5&CSS3

Webpage Editors Notepad++ TextWrangler (Mac Users) Dreamweaver Editplus plus.sourceforge.net/uk/site.htm ngler/

Document Type Definition DTD tag points to URI and Formal Public Identifier (FPI) for the actual definition file. HTML5 simplifies the DTD tag:

HTML5 Shim IE9 fully supports HTML5, not less than IE9 Solutions: make IE read the comments and define new elements

HTML5 Tag List US/docs/HTML/HTML5/HTML5_element_list US/docs/HTML/HTML5/HTML5_element_list _elements.asp _elements.asp

Essential Tags

Special Characters Character Code # # $ $ © © or © ® ® < < > > & & " " (space)

Canvas vs. SVG SVG uses XML DOM Supports event handlers

Color Spaces in CSS Name: aqua, black, blue, fuchsia, gray, grey, green, lime, maroon, navy, olive, purple, red, silver, teal, white, and yellow #rrggbb rgb(rrr,ggg,bbb) rgba(rrr,ggg,bbb,a) a=0 transparent transparent lack of background color (default) transparent same as parent element

CSS selectors Tag selector Class selector ID selector h1, #id,.class { property: values } [quoted if values have spaces]

HTML5 semantic tags,,, and

HTML 5 figures

Box model 2-D box model 3-D CSS box model

HTML 5 Drop and Drag

HTML 5 geolocation navigator.geolocation getCurrentPosition(doing_func_if_succ) function doing_func_if_succ() Errors: error.PERMISSION_DENIED error.POSITION_UNAVAILABLE error.TIMEOUT error.UNKNOWN_ERROR

HTML 5 videos and audios

HTML 5 new input types color date datetime datetime-local month number range search tel time url week

HTML5 new form element

HTML5 local storage Storage localStorage - stores data with no expiration date sessionStorage - stores data for one session localStorage.key=“value”

HTML5 cache...

HTML 5 Server Sent Event Automatic update from server Good for temporary file detection var source=new EventSource(“somefile.php"); source.onmessage=function(event) { document.getElementById("result").innerHT ML+=event.data + " "; };

Call php in HTML or javascript function javaFunction(){var url=" window.open(url, "_self"); }

HTML call javascript function myFunction() { alert("Hello World!"); } Try it document.getElementById("demo").innerHTML=myFunction();

HTML call php Name: Age: Welcome ! You are years old.