1.Elements CSS Frameworks (Source: Project Designs)
2.WYMstyle: a CSS framework (Source: Daniel Reszka)
3.YAML CSS Framework (Source: High Resolution)
4.YUI Grids CSS (Source: Yahoo)
7.Schema Web Design Framework
(Source: David Golding Design)
9.Tripoli Beta CSS Framework
(Source: Monc)
10.ESWAT Web Project Framework
(Source: Philip Karpiak)
11.CwS CSS Framework
(Source: Content with Style)
12.My (not really mine) CSS Framework
(Source: That Standards Guy)
Markup Generator è un semplice tool creato per xhtml/css coders che ti permette di velocizzare il loro lavoro generando codice xhtml e css in maniera intuitiva.
Sito web: http://lab.xms.pl/markup-generator
Con AJAX Language API di google,puoi tradurre blocchi di testo in diverse lingue usando semplicemente javascript.
Sito web: http://code.google.com/apis/ajaxlanguage
Vediamo come installare e configurare:
Premetto che Leopard è già dotato di Apache 2.2 e del PHP. Ma per esigenze personali ho compilato il PHP dai sorgenti distribuiti da PHP.net. E questo mi ha costretto anche a compilare Apache, in quanto quello compreso in Leopard è a 64bit mentre la libphp5.so compilata dai sorgenti è a 32bit ed impedisce al web server persino di avviarsi.
E' necessario installare i tool di sviluppo che trovate direttamente nel DVD di installazione di Leopard. Inseritelo nel lettore del vostro Mac, aspettate che parta lo splashscreen.
Cliccate su Optional Install per installare i tool XCode mediante il pacchetto XcodeTools.mpkg.
In questo modo saremo in grado di compilare tutti i sorgenti necessari senza particolari problemi. Avremo installato, fra l'altro, il compilatore gcc che ci servirà sia per Apache che per PHP.
Niente di più semplice. Leopard è già pronto con Apache 2.2. Dovete solo attivare la condivisione web nelle preferenze di sistema.
Fatto questo accedete via browser a http://localhost (o http://127.0.0.1). Vi si aprirà la pagina di conferma di installazione del webserver. Ma a noi non piace la DocumentRoot configurata di default, ed allora come prima cosa la cambieremo 
Apriamo una finestra del terminale ed accediamo alla directory di Apache:
cd /etc/apache2
Il file di configurazione del webserver è il solito httpd.conf. Apriamolo con vim ed apportiamo le seguenti modifiche.
sudo vim httpd.conf
password:
Notato niente di strano? Ebbene si. Anche su Leopard è stato implementato il comando sudo per aprire ed accedere a file di sistema con tutti i privilegi.
Cerchiamo la riga:
DocumentRoot "/Library/WebServer/Documents"
E modifichiamola in:
DocumentRoot "/Users/VOSTROUTENTE/Sites"
E successivamente cerchiamo la riga:
<Directory "/Library/WebServer/Documents">
E modifichiamola in:
<Directory "/Users/VOSTROUTENTE/Sites">
Per VOSTROUTETE si intende il nome della directory che indentifica la root di sistema del vostro account. Nel mio caso è "davide". Ed inserendo la URI in questo modo la webroot sarà fisicamente nella directory "Siti" del vostro account. State attenti che nel finder il nome della directory che vedete è proprio "Siti", ma è solo un alias dovuto alla lingua italiana. Il nome di sistema dela directory è "Sites" e questo va scritto in ogni file di sistema che in qualche modo interessa questa direttiva.
Per rendere effettive le modifiche riavviamo il webserver:
sudo apachectl graceful
Ma abbiamo detto che il server Apache compreso nella distribuzione Apple non è compatibile con il php compilato dai sorgenti. Quindi, a configrazione ultimata e testata, ricompiliamo il web server dai sorgenti scaricati direttamente da Apache.org. Se lo fate oggi scaricherete la versione 2.2.8. Scompattate l'archivio un po' dove vi pare, entrate nella directory e digitate il solito trittico di comandi.
sudo apachectl stop
cd httpd-2.2.8
./configure --enable-layout=Darwin --enable-mods-shared=all
make
sudo make install
sudo apachectl start
Fatto questo non ci sarà bisogno di riconfigurare il webserver per modificare la DocumentRoot. Andrà bene e verrà usato il file di configurazione precedentemente editato in /etc/apache2.
Scaricate il pacchetto binario direttamente da MySQL.org. Installate il pacchetto mysql-5.0.51a-osx10.5-x86.pkg. Potete anche evitare di installare MySQLStartupItem, dato che al momento con Leopard non funziona. Ed anche il pannello di controllo aggiuntivo non va. Ma per quest'ultimo è stata rilasciata una versione funzionante, scaricabile qui.
Purtroppo non c'è ancora modo di avviare automaticamente il server all'avvio del sistema. La preferenza spuntata non funziona. Ma quantomeno risulta agevole avviarlo manualmente.
Se abbiamo intenzione di usare le funzionalità date alla libreria GD del php, abbiamo la necessità di installare le librerie libpng e libjpeg. E' possibile farlo direttamente utilizzando un archivio binario scaricabile a questo indirizzo. Per semplicità utilizzate il combo installer che in un sol colpo le installa entrambe.
Bene, siamo arrivati al clou della nostra avventura. Scaricato il pacchetto con i sorgenti, scompattiamo l'archivio ed accediamo alla directory da terminale.
cd php-5.2.5
Importante è la stringa di configurazione. Un ./configure --help può togliervi molti dubbi. In ogni caso la mia stringa è la seguente. Dopo il ./configure, i soliti comandi per compilare ed installare il pacchetto.
./configure --prefix=/usr/local/php5 --enable-calendar --with-apxs2=/usr/sbin/apxs --enable-mbstring --with-mysqli=/usr/local/mysql/bin/mysql_config --with-mysql=/usr/local/mysql/ --with-gd --enable-soap --with-zlib --with-jpeg-dir=/usr/local/bin --with-png-dir=/usr/local/bin
make
sudo make install
sudo apachectl graceful
Il comando install si occuperà anche di editare il file di configurazione di Apache per permettere il running della libreria libphp5.so. L'ultimo comando serve a far riavviare il webserver in modo da fargli caricare tutte le librerie necessarie.
Non ri rimane che testare l'installazione! Accediamo alla DocumentRoot e creiamo uno nuovo file. Chiamiamolo info.php. Con un qualsiasi editor di testo, scriviamo:
<?php phpinfo(); ?>
Salviamo e chiudiamo il file ed accediamo via browser a http://localhost/info.php.
phpMyAdmin
Anche qui è tutto molto semplice. Basta scaricare l'ultima release del web tool di amministrazione del server MySQL, scompattare l'archivio in /Users/VOSTROUTETE/Sites e magari rinominare la directory in phpmyadmin per maggior comodità.
Avendo avuto cura che il server MySQL sia avviato, accedete via browser a http://localhost/phpmyadmin/scripts/setup.php ed utilizzate l'interfaccia web per la configurazione.
Per un uso in locale, senza troppo star a pensare alla sicurezza di un pc che non sarà mai utilizzato come web server pubblico, basta selezionare:
scriptcopy.com è una raccolta di script cloni dei servizi web più popolari del web. Ad esempio è possibile trovare cloni di youtube, netvibes, etc..
Sito web: http://www.scriptcopy.com/
Chatto è uno script php/ajax opensource di chat online.
il codice puo’ essere scaricato dahttp://robertobifulco.it/Chatto/download.html
Grazie Roverto per la segnalazione
<div id=”container”>
<b class=”rtop”>
<b class=”r1″></b> <b class=”r2″></b> <b class=”r3″></b> <b class=”r4″></b>
</b>
<!–content goes here –>
<b class=”rbottom”>
<b class=”r4″></b> <b class=”r3″></b> <b class=”r2″></b> <b class=”r1″></b>
</b>
</div>
.rtop, .rbottom{display:block}
.rtop *, .rbottom *{display: block; height: 1px; overflow: hidden}
.r1{margin: 0 5px}
.r2{margin: 0 3px}
.r3{margin: 0 2px}
.r4{margin: 0 1px; height: 2px}
<ol>
<li>
<p>This is line one</p>
</li>
<li>
<p>Here is line two</p>
</li>
<li>
<p>And last line</p>
</li>
</ol>
ol {
font: italic 1em Georgia, Times, serif;
color: #999999;
}
ol p {
font: normal .8em Arial, Helvetica, sans-serif;
color: #000000;
}
<form>
<label for=”name”>Name</label>
<input id=”name” name=”name”><br>
<label for=”address”>Address</label>
<input id=”address” name=”address”><br>
<label for=”city”>City</label>
<input id=”city” name=”city”><br>
</form>
label,input {
display: block;
width: 150px;
float: left;
margin-bottom: 10px;
}
label {
text-align: right;
width: 75px;
padding-right: 20px;
}
br {
clear: left;
}
blockquote:first-letter {
background: url(images/open-quote.gif) no-repeat left top;
padding-left: 18px;
font: italic 1.4em Georgia, “Times New Roman”, Times, serif;
}
<h1><span></span>CSS Gradient Text</h1>
h1 {
font: bold 330%/100% “Lucida Grande”;
position: relative;
color: #464646;
}
h1 span {
background: url(gradient.png) repeat-x;
position: absolute;
display: block;
width: 100%;
height: 31px;
}
<!–[if lt IE 7]>
<style>
h1 span {
background: none;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=’gradient.png’, sizingMethod=’scale’);
}
</style>
<![endif]–>
div{
height:100px;
}
div *{
margin:0;
}
div p{
line-height:100px;
}
<p>Content here</p>
<div class=”roundcont”>
<div class=”roundtop”>
<img src=”tl.gif” alt=”"
width=”15″ height=”15″ class=”corner”
style=”display: none” />
</div>
CONTENT
<div class=”roundbottom”>
<img src=”bl.gif” alt=”"
width=”15″ height=”15″ class=”corner”
style=”display: none” />
</div>
</div>
.roundcont {
width: 250px;
background-color: #f90;
color: #fff;
}
.roundcont p {
margin: 0 10px;
}
.roundtop {
background: url(tr.gif) no-repeat top right;
}
.roundbottom {
background: url(br.gif) no-repeat top right;
}
img.corner {
width: 15px;
height: 15px;
border: none;
display: block !important;
}
<img src=”image.gif” class=”class1 class2″ alt=”" />
.class1 { border:2px solid #666; }
.class2 {
padding:2px;
background:#ff0;
}
<div id=”container”></div>
#container {
margin:0px auto;
}
<p class=”introduction”> This paragraph has the class “introduction”. If your browser supports the pseudo-class “first-letter”, the first letter will be a drop-cap. </p>
p.introduction:first-letter {
font-size : 300%;
font-weight : bold;
float : left;
width : 1em;
}
a{
white-space:nowrap;
}
#main{
overflow:hidden;
}
html{
overflow:-moz-scrollbars-vertical;
}
textarea{
overflow:auto;
}
Via: http://stylizedweb.com/2008/03/12/most-used-css-tricks/
Step 1: HTML Code
HTML code is very simple: we have a DIV with ID "top-panel" which is the and a another layer with ID sub-panel which contains a link to slide up/dow our panel:
...remember to add mootools framework in the page <head> tag:
Step 2: Css code
This is only a proposal about the look of your panel, but you can customize it how you prefer:
Step 3: JavaScript Function
Add this simple JavaScript in the <head> tag of the page:
Sito web: http://woork.blogspot.com/2008/03/sliding-top-panel-using-mootools_05.html
Hosting web by: 
