HTML Playground

HTML Playground is a nice way to present a reference ! It is an (X)HTML and CSS reference by example ;) A perfect companion for learning the YAML (X)HTML/CSS Framework ;)

HTML Playground present the reference in a nice way, they make learning fun ;)
They brilliantly give all of your need in just 5 steps

First is of course, the list of all HTML tags, which you can browse through and select one of it ;)

Back then, i always refer to Emil Stenström's Encyclopedia of HTML Elements from friendly bit, which is very simple that even an elementary school can understand ;)

_____________________________________________________

After you select a tag, a description will be shown to you.

_____________________________________________________

Along with the description, it provides an example code, consisting the tag that you've selected in the first step.

The example are made with the correct structure, complete from title to body.

There are other tags here which you can also click to learn about it ;)

_____________________________________________________

And if you're not satisfied yet, you can add a style to the tag ;)

This come in an easy way !

For every tag you click, it will list all the possible style, in which you can add to the code ;)

_____________________________________________________

All of that, of course, come with the rendered Results ;)

So you don't need to fire-up and editor, save it to an html file, and then open it in your browser :P

All the hassle are gone :D

_____________________________________________________

Now, HTML Playground is sitting in my bookmark ;) This sure come handy when in needs ;) And if you're more curious, there are 3 little buttons on the Example Code area that you might wanna click on it :P


[via: fortysomething]