Introduzione a HTML5. Ispirato quasi del tutto dalle slide pubbliche di Gabriele Gigliotti Dipartimento di Matematica Università degli studi di Udine - PDF

Description
Introduzione a HTML5 Ispirato quasi del tutto dalle slide pubbliche di Gabriele Gigliotti Dipartimento di Matematica Università degli studi di Udine Doctype Made Easy HTML5

Please download to get full document.

View again

of 28
All materials on our website are shared by users. If you have any questions about copyright issues, please report us to resolve them. We are always happy to assist you.
Information
Category:

Calendars

Publish on:

Views: 21 | Pages: 28

Extension: PDF | Download: 0

Share
Transcript
Introduzione a HTML5 Ispirato quasi del tutto dalle slide pubbliche di Gabriele Gigliotti Dipartimento di Matematica Università degli studi di Udine Doctype Made Easy HTML5 !DOCTYPE html !DOCTYPE html html lang= en /html A Bare HTML5 Doc head meta charset= utf-8 title a Funny Title /title /head body !-- very important content goes here -- /body HTML Goes Multimedia (Natively)! Brand new video and audio tags. Natively embedding video and audio files in html file (as you do with images). No Flash, Silverlight or other proprietary plug-in HTML video : The Syntax video src= video.webm controls HTML video : The Syntax video width= 320 height= 240 controls= controls source src= movie.mp4 type= video/mp4 / source src= movie.ogg type= video/ogg / Your browser does not support the video tag. /video La libreria Popcorn.js consente poi di aggiungere sottotitolo al video video src= video.ogv data-timeline-sources= popcorn.xml /video ********* popcorn subtitles language= it align= center subtitle in= 00:00:01:00 out= 00:00:03:00 sagome di legno... /subtitle subtitle in= 00:00:04:00 out= 00:00:06:00 ...altre sagome di legno, /subtitle subtitle in= 00:00:07:00 out= 00:00:010:00 ma ci sono anche dei libri? /subtitle subtitle in= 00:00:11:00 out= 00:00:013:00 eccoli! /subtitle /subtitles /popcorn La Libreria popcorn The Codec War The Codec War Effect video controls source src= video.webm type='video/webm; codecs= vp8, vorbis ' source src= video.mp4 type='video/mp4; codecs= avc1.42e01e, mp4a.40.2 ' Your browser does not support video element. /video Audio audio controls= controls source src= song.ogg type= audio/ogg source src= song.mp3 type= audio/mpeg Your browser does not support the audio element. /audio Audio Web Forms: New Input Types Before HTML5 input type= text Generic use Web forms HTML5 New Input Types HTML5 has several new input types for forms. These new features allow better input control and validation. This chapter covers the new input types: color date datetime datetime-local month number range search tel time url week Web Forms: New Input Types form method= get/post input type= search ... /form New Input Types form input type= ... /form Semantic at work (part 1) New Input Types form input type= ... /form Semantic at work (part 2) Note: type= is not supported in IE9 and earlier. New Input Types form input type= url ... /form New Input Types form input type= tel ... /form Delivering better User experience through semantic! Input Type Calendar Controls input type= date min= max= step= 2 Input Type Calendar Controls form input type= time value= 00:30 ... /form The Canvas Element A place where you can write: JavaScript will be your pencil :) canvas /canvas Or canvas width= 300 height= 300 / canvas The Canvas 2D API See note [5] The Canvas 2D Work [6] Developed A Custom JavaScript Library [7] !--[if IE] script type= text/javascript src= excanvas.js /script ![endif]-- The SVG tag SVG is a language for describing 2D graphics in XML. Canvas draws 2D graphics, on the fly (with a JavaScript). SVG is XML based, which means that every element is available within the SVG DOM. You can attach JavaScript event handlers for an element. In SVG, each drawn shape is remembered as an object. If attributes of an SVG object are changed, the browser can automatically re-render the shape. Canvas is rendered pixel by pixel. In canvas, once the graphic is drawn, it is forgotten by the browser. If its position should be changed, the entire scene needs to be redrawn, including any objects that might have been covered by the graphic. The SVG tag svg width= 300 height= 200 polygon points= 100,10 40, ,78 10,78 160,198 style= fill:lime;stroke:purple;stroke-width:5;fill-rule:evenodd; / /svg Semantic Rules HTML5 new semantic tags. nav footer article header section aside They bring a clear meaning to our pages. Semantic Rules Migration from HTML4 to HTML5
Related Search
Similar documents
View more...
We Need Your Support
Thank you for visiting our website and your interest in our free products and services. We are nonprofit website to share and download documents. To the running of this website, we need your help to support us.

Thanks to everyone for your continued support.

No, Thanks