Archive for 'css'
Impredire a Safari di regolare il testo alla rotazione dell’iPhone!
Posted on 23. Jun, 2010 by daniele.
Quando si ruota l'iPhone, Safari regola automaticamente la dimensione del testo. Se per qualche ragione si desidera evitare questo effetto, è sufficiente utilizzare la dichiarazione CSS che trovate qui sotto. Deve essere inserita nel vostro file CSS.
Il -webkit-text-size-adjust è una proprietà CSS webkit-only che permette di controllare la regolazione di testo.
html, body, form, fieldset, p, div, h1, h2, h3, h4, h5, h6 { -webkit-text-size-adjust:none; }
Continue Reading
div fisso in basso con i css
Posted on 31. Mar, 2010 by Administrator.
<!-- IE in quirks mode --><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"><title>Fixed footer</title> <styletype="text/css"> body{ margin:0; padding:0 0 <length> 0; } div#footer{ position:absolute; bottom:0; left:0; width:100%; height:<length>; } @media screen{ body>div#footer{ position: fixed; } } * html body{ overflow:hidden; } * html div#content{ height:100%; overflow:auto; } </style> <divid="footer"> footer </div> <divid="content"> content </div> da: http://limpid.nl/lab/css/fixed/footer
Continue Reading
Realizzare la chat di Facebook con jQuery e CSS
Posted on 14. Jan, 2010 by daniele.
Grazie a questo tutorial imparerete a realizzare la parte grafica della chat del Social Network più famoso al mondo, utilizzando jQuery e CSS!
Link Parte 1: http://www.sohtanaka.com/web-design/facebook-style-footer-admin-panel-part-1/
Link Parte 2: http://www.sohtanaka.com/web-design/facebook-style-footer-admin-panel-part-2/
Demo: http://www.sohtanaka.com/web-design/examples/footer-panel/
Continue Reading
Un fix che corregge la trasparenza su Internet Explorer 6
Posted on 22. Nov, 2009 by daniele.
Per chi come me sviluppa siti internet deve (purtroppo) testare il proprio sito su tutti i browser. Internet Explorer 6 viene ancora utilizzato e quindi bisogna correggere i bug che si verificano anche in questo browser ormai obsoleto. Con l'arrivo del web 2.0 le GIF sono state sostituite dalle PNG, quest'ultime infatti possono essere salvate eliminando lo sfondo e creando così una trasparenza alle immagini. Purtroppo Internet Explorer 6 non riesce a far visualizzare le PNG trasparenti correttamente rimpiazzando la trasparenza con uno sfondo grigio. Questo piccolo javascript riuscirà a risolvere definitivamente questo "grosso" problema!
<!--[if lte IE 6]> <script type="text/javascript"> function correctPNG() // correctly handle PNG transparency in Win IE 5.5 &…
Continue Reading
[Css-jQuery] Effetto scala grigi all’hover dell’immagine
Posted on 16. Sep, 2009 by daniele.
CODICE HTML
<ul class="gallery"> <li> <a href="#" class="thumb"><span><img src="image.gif" alt="" /></span></a> <h2><a href="#">Image Name</a></h2> </li> </ul>
CODICE CSS
ul.gallery { width: 708px; /*--Adjust width according to your scenario--*/ list-style: none; margin: 0; padding: 0; } ul.gallery li { float: left; margin: 10px; padding: 0; text-align: center; border: 1px solid #ccc; -moz-border-radius: 3px; /*--CSS3 Rounded Corners--*/ -khtml-border-radius: 3px; /*--CSS3 Rounded Corners--*/ -webkit-border-radius: 3px; /*--CSS3 Rounded Corners--*/ display: inline; /*--Gimp Fix aka IE6 Fix - Fixes double margin bug--*/ } ul.gallery li a.thumb { width: 204px; /*--Width of image--*/ height: 182px; /*--Height of image--*/ padding: 5px; border-bottom: 1px solid #ccc; cursor: pointer; } ul.gallery li span { /*--Used to crop image--*/ width: 204px; height: 182px; overflow: hidden; display: block; } ul.gallery li a.thumb:hover { background: #333; /*--Hover effect for browser with js turned off--*/ } ul.gallery li h2 { font-size: 1em; font-weight: normal; text-transform:…
Continue Reading
Separatore paragrafi con i CSS!
Posted on 26. Aug, 2009 by daniele.
@media screen { .page-break { height:10px; background:url(page-break.gif) 0 center repeat-x; border-top:1px dotted #999; margin-bottom:13px; } } @media print { .page-break { height:0; page-break-before:always; margin:0; border-top:none; } }
Continue Reading
Realizzare 3 colonne con il tag e i CSS
Posted on 09. Aug, 2009 by daniele.
CODICE HTML
<ul> <li class="col1">Eggs</li> <li class="col1">Ham</li> <li> </li> <li class="col2 top">Bread</li> <li> </li> <li class="col2">Butter</li> <li> </li> <li class="col3 top">Flour</li> <li> </li> <li class="col3">Cream</li> </ul>
CODICE CSS
ul {list-style:none;} li {line-height:1.3em;} .col2 {margin-left:100px;} .col3 {margin-left:200px;} .top {margin-top:-2.6em;} /* the clincher */
Continue Reading
Css e le immagini di sfondo
Posted on 25. Oct, 2008 by Administrator.

Sito web: http://www.webdesignerwall.com/tutorials/how-to-css-large-background/
Continue Reading
Costruire un template con i css tutorial passo passo
Posted on 30. Sep, 2008 by Administrator.

Fantastico tutorial che passo passo, sul campo, ci spiega come Costruire un template con i css.
Sito web: http://www.maxdesign.com.au/presentation/wentworth/
Continue Reading
Tutorial css applicare stile a una tabella
Posted on 20. Sep, 2008 by Administrator.

sito web: http://www.webdesignfromscratch.com/datasheet.cfm



