Ny doctype<br />Nya semantiska element<br />Dokumentstruktur<br />Gamla browsers?<br />Nya input types<br />
Ny doctype<br /><!doctype html><br />Bakåtkompatibel<br />Inte XHTML<br />
Nya semantiska taggar<br /><header><br /><nav><br /><article><br /><section><br /><aside><br /><footer><br /><hgroup><br /...
IE 6 7 8<br />HTML5 shim javascript<br />Lägger till HTML5 element i dom-trädet<br />CSS på ex <article><br />jQuery selek...
Modernizr.js <br />Lägger till HTML5 element i dom-trädet<br />Feature detection<br />Slipper göra browser detection<br />...
Modernizr.js<br />Lägger till klasser på <html><br />
Nya input types<br /><input type=”email”><br />search, tel, url, email, datetime, date, month, week, time, datetime-local,...
type=”email”<br />
type=url<br />
type=number<br />
Div. referenser<br />http://diveintohtml5.org/semantics.html<br />https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-...
Upcoming SlideShare
Loading in...5
×

Html5

939
-1

Published on

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
939
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
7
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Html5

  1. 1.
  2. 2. Ny doctype<br />Nya semantiska element<br />Dokumentstruktur<br />Gamla browsers?<br />Nya input types<br />
  3. 3. Ny doctype<br /><!doctype html><br />Bakåtkompatibel<br />Inte XHTML<br />
  4. 4. Nya semantiska taggar<br /><header><br /><nav><br /><article><br /><section><br /><aside><br /><footer><br /><hgroup><br /><time><br /><mark><br />
  5. 5.
  6. 6. IE 6 7 8<br />HTML5 shim javascript<br />Lägger till HTML5 element i dom-trädet<br />CSS på ex <article><br />jQuery selektorer $(”article .item”).dev()<br /><!--[if lt IE 9]><script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]--><br />
  7. 7. Modernizr.js <br />Lägger till HTML5 element i dom-trädet<br />Feature detection<br />Slipper göra browser detection<br />if(Modernizr.fontface) {...}<br />if(Modernizr.canvas) {...}<br />if(Modernizr.cssgradients) {...}<br />
  8. 8. Modernizr.js<br />Lägger till klasser på <html><br />
  9. 9. Nya input types<br /><input type=”email”><br />search, tel, url, email, datetime, date, month, week, time, datetime-local, number, range, color<br />type=“text” i omoderna browsers<br />
  10. 10. type=”email”<br />
  11. 11. type=url<br />
  12. 12. type=number<br />
  13. 13. Div. referenser<br />http://diveintohtml5.org/semantics.html<br />https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-browser-Polyfills<br />http://html5doctor.com/<br />http://html5boilerplate.com/<br />
  1. Gostou de algum slide específico?

    Recortar slides é uma maneira fácil de colecionar informações para acessar mais tarde.

×