Skip to content

Latest commit

 

History

History
58 lines (42 loc) · 2 KB

what_new_html5.md

File metadata and controls

58 lines (42 loc) · 2 KB

What's new in HTML5 Back

HTML5 has provided a lot of new tags:

  • Printing: <canvas>
  • Multimedia: <video> and <audio>
  • Storage: localStorage and sessionStorage
  • Semantic: <article>, <footer>, <header>, <nav> , and <section>
  • Form: <input type="calendar">, <input type="date">, <input type="time">, <input type="email">, <input type="url">, and <input type="search">
  • Technology: webworker, websocket, and Geolocation

HTML5 has removed some old tags:

  • Behavior: <font>, <basefont>, <big>, <center>, <s>, <strike>, <tt>, and <u>
  • Side Effect: <frame>, <frameset> , and <noframes>

Compatibility Problems

We can use document.createElement() to create a new HTML5 tag in IE6/IE7/IE8 (remember to define the default style of those tags), or we can also use html5shim like this:

<!--[if lt IE 9]>
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<[endif]-->

How to distinguish HTML5?

Just distinguish it from <!DOCTYPE> or tags.

HTML5 Offline Storage

  • Theory: HTML5 Offline Storage is based on the cache of a new file named .appcache, which will list resources that should be cached. Those cached resources will be stored into local like Cookie, and extracted when offline.
  • Useage:
    1. set manifest attribute in the <html> tag.

      <html manifest="cache.manifest"></html>
    2. create a file named cache.manifest:

      CACHE MANIFEST
      #v0.11
      
      CACHE:
      
      js/app.js
      css/style.css
      
      NETWORK:
      resourse/logo.png
      
      FALLBACK:
      / /offline.html
      
      • CACHE: a list of resources to be cached. (pages will be automatically cached, so you don't need to list them)
      • NETWORK: a list of resources which should be read online.
      • FALLBACK: resources to replace those failed to access online.