Содержание
- 2. About me Mikhail Kolesnikov Software Engineer Skype: kmisha@outlook.com E-mail: mikhail_kolesnikov@epam.com
- 3. Agenda New features HTML5 Semantics elements data-* attributes New types for Audio & Video Inline SVG
- 4. HTML5 related APIs
- 5. Semantic HTML5 New Elements
- 6. New element section article aside main header footer nav dialog figure New semantic elements Deprecated acronym
- 7. ... ... … ... ... ... New semantic elements
- 8. data-* HTML5 attributes
- 9. data-* attributes id="msglist" data-user="bob" data-list-size="5" data-maxage="180” > var msglist = document.getElementById("msglist"); var show = msglist.getAttribute("data-list-size"); msglist.setAttribute("data-list-size",
- 10. data-* attributes var msglist = document.getElementById("msglist"); var show = msglist.dataset.listSize; msglist.dataset.listSize = show+3;
- 11. types HTML5 New
- 12. New types
- 13. New types https://www.w3schools.com/tags/att_input_type.asp
- 14. New types
- 15. HTML5 New attributes
- 16. Placeholder Autofocus Required Pattern New attributes type="text" pattern="2-[0-9]{3}-[0-9]{3}" />
- 17. HTML5
- 18. autoplay> type="video/ogg" /> type="video/mp4" /> Your browser does not support the element. https://www.w3schools.com/html/tryit.asp?filename=tryhtml5_video
- 19. autoplay autobuffer height loop preload poster src width
- 20. HTML5
- 21. Your browser does not support the element. https://www.w3schools.com/html/tryit.asp?filename=tryhtml5_audio_all
- 22. autoplay autobuffer controls loop preload src
- 23. HTML5 Media events
- 24. Media events abort canplay ended error loadeddata loadstart pause https://www.w3schools.com/tags/tryit.asp?filename=tryhtml5_av_event_loadeddata play progress ratechange seeked seeking suspend
- 25. function PlayVideo() { var v = document.getElementsByTagName("video")[0]; v.play(); } Media events
- 26. HTML5 Inline SVG and MathML
- 27. Inline SVG and MathML π ⁢ r 2 . HTML5 support for scalable vector graphics (SVG)
- 28. W3 Schools / HTML5 Tutorials Point / HTML5 Tutorial 28 HTML5 Features, Tips, and Techniques you
- 30. Скачать презентацию