Foto di autore con CSS e HTLM

Creato il 23 settembre 2013 da Wanesia
Buon lunedi` a tutti oggi voglio parlarvi come inserire porzioni di codice di CSS e HTLM per fare una foto di benvenuto per autore del blog.Di certo protemmo farla con Photoshop o con Mappatura, ma aggiungendo semplici codici possiamo avere anche l´effetto delle foto  sopra.
Prima di mettervi all´opera e´ buona norma fare un backup del vostro template,onde evitare spiacevoli sorprese.
Il codice originale e´ stato preso da digital ispiration.
Dobbiamo inserire solamente due codici,il primo direttamente nel template sotto <head>
<style type='text/css'>
.picture { background-color: #FFE4C4;
border: 1px solid #CCCCCC; padding: 3px;
font: 14px/1.4em The Only Exception , sans-serif; }
.picture img { border: 1px solid #CCCCCC;
vertical-align:middle; margin-bottom: 3px; }
.right { margin: 0.5em 0pt 0.5em 0.8em; float:right; }
.left { margin: 0.5em 0.8em 0.5em 0; float:left; }
</style>
il secondo nel layout del nostro template. Aggiungendo il codice su un gadget Javascript.
<div class="picture left" style="width:250px;"> <img src="URL_della_Foto" alt="about" height="150" width="250" />
Text here.
<center>
<a href="" target="_blank"><img src="http://i43.tinypic.com/350oyeg.jpg" alt="" border="0" /></a></center></div>
Personalizzazioni:
  1. La parte in rosso puo´ essere personalizzata (qui trovi altri colori) e´ il colore del frame della Polaroid
  2. La parte in blu corrisponde alla dimensione del bordo della Polaroid
  3. La parte gialla si puo´ personalizzare con un font (qui ne trovi alcuni) a piacere.
Spero che il tutorial e´ stato molto chiaro,per varie domande sono a vostra disposizione lasciate un commento sotto questo post.
Credits: foto su devianart.com
facebook//twitter//g+//insta//bloglovin//chictopia//pinterest//hellocoton//

Potrebbero interessarti anche :

Possono interessarti anche questi articoli :

  • Info su come scegliere i caratteri (faccio la maestrina su C'è Crisi)

    C'è Crisi è un blog famoso per i suoi linky party, ma la sua autrice Alex ha avuto anche l'idea di coinvolgere i suoi followers per condividere i trucchi e... Leggere il seguito

    Il 04 luglio 2013 da   Pe
    DIARIO PERSONALE, PER LEI
  • Il 63

    63 Cabalah SIMBOLISMO e SIGNIFICATO: ”Nel momento del suo massimo splendore il sole fecondante, prima brucia e isterilisce poi rigenera la vita.” 63 è il... Leggere il seguito

    Il 21 maggio 2013 da   Lucrezia Paci
    PER LEI
  • Blog under construction

    aaalora... ieri ho passato il pomeriggio (e la notte.. ma la sera sono uscita dai XD) a cercare un nuovo template per il blog che soddisfacesse le mie... Leggere il seguito

    Il 15 agosto 2012 da   Xasperadastra
    BELLEZZA, PER LEI
  • Karel Music Expo: da venerdì a Cagliari

    Venerdì a Cagliari anteprima del Karel Music Expo: cinque ore di musica con Killing Joke, Il Teatro degli Orrori e Tying Tiffany in concerto nella nuova Arena... Leggere il seguito

    Il 11 luglio 2012 da   Yellowflate
    VIAGGI
  • A better blogging... #1

    Benvenute in una serie di articoli lunghi e strazianti dove la BVZL (Buona Vecchia Zia Laura) si lamenta di quanto il web faccia schifo e di come un buon 80%... Leggere il seguito

    Il 22 marzo 2012 da   Haze
    BELLEZZA, PER LEI
  • Totally Random #9

    Questo totally random sarà più random del solito, vi avverto :) poi ci ho messo dentro un sacco di video -canzoni, trailer, cose del genere- e immagini. Leggere il seguito

    Il 01 marzo 2012 da   Haze
    BELLEZZA, PER LEI