Facebook Twitter

Quick Tip: The Awesome Details Element. One of my favorite new HTML5 tags, which has only recently been integrated into Chrome (as of version 12), is the details element.

Quick Tip: The Awesome Details Element

I'll show you to use it in today's quick tip. What Does the details Tag Do? It essentially allows us to show and hide content with the click of a button. You're surely familiar with this type of effect, but, up until now, it had always been achieved with JavaScript. Imagine a heading with an arrow next to it, and when you click on it, additional information below becomes visible. Liste des balises HTML5 - Aide mémoire et liens vers le W3C. HTML5's placeholder Attribute. HTML5 has introduced many features to the browser; some HTML-based, some in the form of JavaScript APIs, but all of them useful.

HTML5's placeholder Attribute

One of my favorites if the introduction of the placeholder attribute to INPUT elements. The placeholder attribute shows text in a field until the field is focused upon, then hides the text. You've seen this technique a billion times with JavaScript, but native HTML5 support is even better! The HTML You'll notice that all you need to do is add a placeholder attribute with the generic text of your choice. HTML5 Semantics - Smashing Coding. Advertisement Much of the excitement we’ve seen so far about HTML5 has been for the new APIs: local storage, application cache, Web workers, 2-D drawing and the like.

HTML5 Semantics - Smashing Coding

But let’s not overlook that HTML5 brings us 30 new elements to mark up documents and applications, boosting the total number of elements available to us to over 100. Sexy yet hollow demos aside, even the most JavaScript-astic Web 2.0-alicious application will likely have textual content that needs to be marked up sensibly, so let’s look at some of the new elements to make sure that your next project is as semantic as it is interactive. HTML5 : Local Storage » Samarium Blog. LocalStorage : Page de démonstration et tutoriel - <html5> par l'exemple - Le site de démo des balises HTML5 et de test du support des navigateurs. <p>JavaScript doit être activé !

localStorage : Page de démonstration et tutoriel - <html5> par l'exemple - Le site de démo des balises HTML5 et de test du support des navigateurs.

<br />Il semblerait que JavaScript soit désactivé ou non supporté par votre navigateur. <br />Pour visualiser correctement ce site, veuillez activer JavaScript dans les options de votre navigateur et réessayez. </p> Mise à jour : 2013-01-18 Cette fonctionnalité vient en renfort du mécanisme des cookies en étendant leur fonctionnement.