In HTML5, It adds a mount of elements, these elements are more easier to present the document in browser.
###Structure element Before HTML5, we just use div tag to act as the Document Structure Element, but now the HTML5 supports more elements like section, article, nav, aside, header, footer and so on.
HTML5 adds new common attributes for original HTML Tag, and these attributes enhances the HTML elements’s function.
contentEditable
The contentEditable attribute supports most tags. The browser allows user edits the content of element if this attribute is set to true. These elements is not like input or textarea tags. They are not support editable content like table, div, span and so on these tags.
The tool of choice for fighting IE problems is the conditional stylesheet. IE provides comment tags, supported all the way up to the current IE 8 to target specific versions, as well as greater-than/less-than stuff for targeting multiple versions at once.
Why use conditional stylesheets?
You got problems, they need fixin’
Keeps your code hack-free and valid
Keeps your main stylesheet clean
Perfectly acceptable technique, sanctioned by Microsoft
When we develop web application, if we write or modify the HTML structure, CSS style and javascript, we need to compile the code and deploy it, and then refresh page, finally we can see our changes. There are so many steps. So could we skip these steps and just see our changes on page directly when we save the codes. Yes, I can answer you now.
In order to achieve this goal, we need to install Guard, LiveReload and related stuff, configure it in our web application project.
As web developer, we usually need to face the challenge of making cross-browser compatible. Especially IE browser’s multiple version. Because its quirks of rendering websites differently across its versions of IE6, IE7, IE8 and possibly IE9 and IE10.
Most of us have only one version of IE browser on our computer, and the compatible mode of IE is not really specific version which you want to simulate.
Ractive.js is a template-driven UI library, it transforms your templates into blueprints for application that are interative by default. Ractive.js is very similar with AngularJS, and it supports Two-way binding, animations as well. Another powerfull feature is SVG support.
Template + Data = UI
You just need to prepare your html template and datas, and the Ractive.js will automatically to combine them then give you what you want. Whe you change your datas, it intelligently updates the real DOM.
Usage
First, you need to include Ractive.js to your application. Just like include other javascript librarys easily. You can download it to local and then include it. And if you want include latest version, you just put below codes to your project.