Zen coding – fast html and css
Zen coding is a sort of a shortcut library for writing html and css, so when you write your code it is faster and more efficient. In addition it help with writing errors like closing tags and so on.
Zen is full with those shortcuts and i do not intend to go over all of them (i do not even remember all), i will only go through what seem to me to be the most common or useful. At the end of this i will add PDF file that you can download, it contains all you need to know about the shortcuts.
creating an html 5 page : html:5
linking an external CSS file : link:css
image tag: img
We are not talking just about html elements. If for example in our css file we want that the font will be bold: fw:b
It is that simple and great, and its not all
we can nest elements in a sibling relation: div#one+div#two
this short line will produce two divs with the appropriate ids.
we can create a parant-child relations: div#three>div#four
this will create a div with id three and a nested div with an id of four.
we can also designate a number for creating a certain element several times: ul#menu>li.menu-item*5
this will create a list with five list items.
for a final and more complex example, lets create a form (this is just F***** amazing): form:post>fieldset>legend+input:email+textarea+input:submit
With just a short line we create a simple form. Obviously this is just a simple example but you can see how fast and efficient this is.