Archive for 'css'


Impredire a Safari di regolare il testo alla rotazione dell’iPhone!

Posted on 23. Jun, 2010 by daniele.

0

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.

0 

<!-- IE in quirks mode -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
<title>Fixed footer</title>
<style type="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>
<div id="footer"> footer </div>
<div id="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.

0

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.

0

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.

0

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.

0 

 
@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

Posted on 09. Aug, 2009 by daniele.

0

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.

0

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.

1

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.

0

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

Continue Reading

1 2 3 4 »Last »