12
July
2011

CSS: effetto ‘cucito’

Quello che ho scovato oggi su designzzz.com è un altro effetto fantastico da dare con il CSS.
Il foglio di stile si sta rivelando un vero e proprio alleato, se non voglio ricorrere al background ;) .
Il suo nome è ‘stitched’ (sarà cucito probabilmente, ma tanto quel che conta è il risultato XD ) e l’effetto che viene fuori ve lo mostro

Se vuoi sapere come si fa ad ottenere questo effetto ‘cucitura’ tanto simpatico continua a leggere.
Se vuoi sapere come si fa ad ottenere questo effetto ‘cucitura’ tanto simpatico continua a leggere.


Visto che forza????????
Dunque per avere l’effetto ‘cucito’ nei vostri ‘div’ devi semplicemente copiare e incollare questo codice nel tuo foglio di stile:

.stitched {
padding: 5px 10px;
margin: 10px;
background: #ff0030;
color: #fff;
font-size: 16px;
font-weight: bold;
line-height: 1.3em;
border: 2px dashed #fff;
border-top-left-radius: 3px;
-moz-border-radius-topleft: 3px;
-webkit-border-top-left-radius: 3px;
border-bottom-right-radius: 3px;
-moz-border-radius-bottomright: 3px;
-webkit-border-bottom-right-radius: 3px;
border-top-right-radius: 3px;
-moz-border-radius-topright: 3px;
-webkit-border-top-right-radius: 3px;
-moz-box-shadow: 0 0 0 4px #ff0030, 2px 1px 4px 4px rgba(10,10,0,.5);
-webkit-box-shadow: 0 0 0 4px #ff0030, 2px 1px 4px 4px rgba(10,10,0,.5);
box-shadow: 0 0 0 4px #ff0030, 2px 1px 6px 4px rgba(10,10,0,.5);
}

Poi dai al tuo ‘div’ il selettore ‘class’ stitched

La prima cosa che mi è venuta in mente è che ci si potrebbe fare un menu carinissimo con questo effetto!
Se dovessi cambiare grafica, magari lo userò ;) .
E tui che ne pensi???


Dai un'occhiata anche qui:



5 commenti per “CSS: effetto ‘cucito’”

Rici86 ha detto:

Ma che bello!!! XD

Rici86 ha detto:

JJ, non riesco più a vedere i tuoi ultimi post sul mio blog :( Il feed Rss si ferma a 2 mesi fa :(

jj4me ha detto:

forse perchè ho inserito il blog nella cartella ‘blog’ e quindi l’url dei feed è cambiato…un errore mio che ho scordato di modificarlo…provvedo subito :)

jj4me ha detto:

ok cambiato l’url dei feed ;) puoi trovarlo cliccando sull’iconcina in alto a sinistra sotto il menu :*

Rici86 ha detto:

Grazie mille :D











  • Commentare, perchè?

    Ecco qualche buon motivo per lasciare un commentino nel mio bloggino piccino, picciò :
    non costa nulla
    fa bene condividere i propri pensieri
    puoi levarti qualche curiosità in più
    vuoi diventare partner
    ti piacciono i miei lavoretti in pannolenci e vuoi comprarne uno...
    i commenti mantengono VIVO il blog!!!
  • Recent Comments

    • jj4me: vero XD
    • MariKa: :sbav: Troppo bello!
    • Rici86: Eh già ;)
    • jj4me: evidentemente i banner e compagnia bella, funzionano alla grande ;)
    • Rici86: JJ, sai che è passato anche da me? :O
  • Recent Posts

  • GRAFICAspiralidoso

    sign_3retouch_spiceset_bacon3set_bacon2set_baconwall_charmedsign#2sign_rose_mcgowansign_charmed1sign#1retouch_Yunjin_ Kimretouch01real loveVIN DIESELlaurenicon_cha3icon_cha2icon_cha1colorize_salma_hayekicon_rose_mcgowan2