background preloader

ESEMPI

Facebook Twitter

Wormz. Un esperimento in canvas e HTML5. Abbiamo già visto in passato delle vere e proprie opere d'arte realizzate con tecnologie HTML5.

wormz. Un esperimento in canvas e HTML5

Questa volta vogliamo presentarvi un piccolo gioiello che abbiamo scovato in giro per il web e che dimostra come con tanta fantasia e un po' di HTML5 si possano realizzare effetti davvero strabilianti. Ecco a voi wormz, un esperimento con canvas tanto bello quanto, per certi versi, inquietante. Si tratta in sostanza di una piccola opera che sfrutta canvas per replicare, attraverso tanti piccoli vermetti verdi su sfondo nero, l'immagine che gli viene passata. L'effetto è davvero affascinante. E la cosa bella è che, essendo un giochetto HTML5 e dunque perfettamente integrato con il browser e il resto del DOM, si possono variare i parametri a piacimento, facendo anche il drag and drop di una propria immagine dal desktop!

Buoni vermicelli a tutti! 15 Free HTML5 and CSS Templates. Ready-made HTML5 templates are currently one of the most sought after resources within the web design community.

15 Free HTML5 and CSS Templates

They not only offer a quick and easy-to-edit solution for building modern websites, they also offer a fantastic route to explore and understand HTML5s syntax. All of the themes below are free and all have been coded with HTML5. Enjoy them :) Minimalism Minimalism is a simplistic HTML5 and CSS3 template. Single-Page Scrolling Portfolio Template This flawless scrolling single-Page HTML5 template works perfectly for web designers, photographers and graphic designers as a means for displaying a portfolio. ElegantPress ElegantPress is a variable-column HTML5 and CSS3 template.

Simple Style A simple, fixed width five page template, with a sleek, modern look. Vibrant & Professional Vibrant & Professional Download PageView the Demo → Nova Nova is a clean HTML5 template that comes with five page templates, working contact form, homepage slider and built in Twitter feed. HTML5 Canvas Tutorials. Pure CSS3 Post Tags. This is a rather simple pure CSS trick you can use to style your blog post tags, usually placed at the bottom of the posts.

Pure CSS3 Post Tags

Pure CSS post tags uses at least 2 CSS tricks such as CSS triangles and CSS circles. Take a look at the demo For CSS triangles you need to manipulate borders of an element that has zero height and width. CSS circle is simpler. All you need is a square element with rounded corners set to at least half the size of the element. I usually markup tags with unordered list. <ul class="tags"><li><a href="#">tag</a></li><li><a href="#">tag name</a></li></ul> I will add :before and :after pseudo elements and style them to achieve the styling I wanted I am placing the tags list at the bottom of the post element with adjusting ULs absolute position Height (and line-height) of the list item LI and anchor A is set.

Next to style is the anchor element. To achieve the pointed edge we are adding a :before pseudo-element. The last element to add is the :after pseudo-element. That is it! HTML5 mobile webapp framework. The Wine Cabinet.