-
.
D. S. I. STAFF
- Group
- Founder
- Posts
- 2,651
- Reputazione
- +1,356
- Location
- Da casa mia
- Status
- Offline
Ciao ragazzi vi propongo alcuni esempi di codici da usare nei vostri Topic soprattutto chi scrive guide, insierisce un progetto oppure vanno bene anche nei messaggi se si vuole avere un immagine cliccabile ecc...
Comunque sia fatene buon uso
Nota evidenziata alert:CODICE<div class="alert">INSERIRE QUI IL TESTO</div>
Risultato:ATTENZIONE: Non prendete fischi per fiaschi come fà di solito kevin...
Nota evidenziata Info :CODICE<div class="info">INSERIRE QUI IL TESTO</div>
Risultato:Info: Altrimenti: Non prendete fischi per fiaschi come fà di solito kevin per via della vecchiaia avanzata...
Link + testo:CODICE<a href="http://www.sito.com">qui scrivete quello che volete tipo: vai al sito o clicca qui</a>
Risultato: Dsi in questo caso ho inserito il link della homepage di Dsi e scritto Dsi nel testo
Immagine cliccabile:questa vi può servire per inserire un immagine che porta per esmpio a un vostro progetto.CODICE<a href="Link del sito"><img src="link immagine" border="0"></a>
Risultato:
Aggiungere colore e dimensioni al testo:Utile se nel forum non trovate il colore che volete o la grandezza del testoCODICE<font face="verdana" size="2" color="#Colore">Ultime novità</font>
Risultato 1: Ultime novità Se volete che il testo sia in grassetto aggiungete Ultime novità
Risultato 2: Ultime novità
Risultato 3: Ultime novità
Per i colori HTML andate qui
Testo in movimento:CODICE<marquee align="middle" direction="left"scrolldelay="5">Il vostro testo qui</marquee>
Risultato:
Aggiungere colore e dimensione al testo scorrevole:CODICE<marquee align="middle" direction="left"scrolldelay="5"><span style="color:#Colore;font-size:16.5pt;font-family:verdana"><b>Il vostro testo qui</b></span></marquee>
.
-
.
D. S. I. STAFF
- Group
- Founder
- Posts
- 2,651
- Reputazione
- +1,356
- Location
- Da casa mia
- Status
- Offline
Altri codici...
Ecco una lista:
-Per mettere il testo in corsivoCODICE<i>Testo prova</i>
esempio: Testo prova
-Per mettere il testo in grassettoCODICE<b>Testo prova</b>
esempio: Testo prova
-Per sottolineare il testoCODICE<u>Testo prova</u>
esempio: Testo prova
-Per barrare il testoCODICE<del>Testo prova</del>
esempio:Testo prova
-Per colorare le scritte (titolo, provenienza, messaggi, ecc.)CODICE<font color="codice colore">
-Per colorare una scrittaCODICE[color=QUI INSERITE IL COLORE CHE VOLETE IN INGLESE]Testo prova[/color]
esempio: Testo prova
-Per nascondere una parte del profilo (titolo personalizzato, messaggi e provenienza)CODICE<div style="display: none"><div></div>
-Per inserire un'immagine nel profilo (sostituire xx con le dimensioni che si vogliono)CODICE<img src=indirizzo immagine width="XX" height="XX">
-Inserire una tabella per gli interessiCODICE<tr><td class="title2" colspan="2"<br><align="center">TITOLO VOLUTO</td></tr><tr><td valign="top" width="30%"><b></b></td><td></td></tr><td ="" valign="top"><b><br>SOTTOTITOLO VOLUTO</td><td><br> TESTO VOLUTO<br></td></tr
-Testo come apiceCODICETesto <sup>prova</sup>
esempio: Testo prova
-Testo come pediceCODICETesto <sub>prova</sub>
esempio: Testo prova
-Testo lampeggianteCODICE<marquee direction="up" scrollAmount=35 height="40" width="80%">Testo prova</marquee>
esempio:
-Inserire una lista con varie vociCODICE<UL TYPE=square>
1° voce
2° voce
3° voce
[...]
</UL>
esempio:
1° voce
2° voce
3° voce
[...]
-Per inserire un bottone con testoCODICE<button>Testo prova</button>
esempio:
-Inserire un bottone con un linkCODICE[URL=QUI INSERITE IL LINK]<button>Testo prova</button>[/URL]
esempio:
-Inserire uno sfondo nella firmaCODICE<div style="background-image:QUI METTETE IL LINK DELL'IMMAGINE"> QUI LA VOSTRA FIRMA</div>
-Testo che rimbalza ai latiCODICE<marquee behavior="alternate" width="30%">Testo prova</marquee>
esempio:
-Per dare ombre e stili a paroleCODICE<span style="display:block;color:COLORE TESTO;text-shadow:COLORE OMBRA NUMEROpx NUMEROpx NUMEROpx">Testo prova</span>
esempio: Testo prova
PICCOLA SPIEGAZIONE
Per impostarlo a vostro piacere dovete mettere i due colori (nome in inglese o codice) e settare i tre numeri:
-il primo serve per la distanza dell'ombra in orizzontale (maggiore numero = maggiore distanza)
-il secondo serve per la distanza dell'ombra in verticale (maggiore numero = maggiore distanza)
-il terzo serve per l'intensità della sfocatura dell'ombra (maggiore numero = maggiore sfocatura ombra)
-Inserire link in una scritta (il link si aprirà nella pagina corrente)CODICE<a href=QUI INSERITE IL LINK>Testo prova</a>
esempio: Testo prova
-Inserire link in una scritta (il link si aprirà in una nuova pagina)CODICE<a href=QUI METTETE IL LINK target=blank>Testo prova</a>
esempio: Testo prova
-Far scorrere la firma o un testoCODICE<marquee direction=QUI METTETE LA DIREZIONE IN CUI VOLETE CHE SCORRA scrollAmount=QUI METTETE LA VELOCITA DI SCORRIMENTO>Testo Prova</marquee>
<marquee direction=left scrollAmount=5>Testo prova 2</marquee>
<marquee direction=left scrollAmount=5>Testo prova 3</marquee>
esempio:
-Inserire un box di testoCODICE<textarea>Testo prova</textarea>
esempio:
-Inserire un menù a tendinaCODICE<select>
<option value="1">Testo prova</option>
<option value="2">Testo prova 2</option>
<option value="3">Testo prova 3</option>
</select>
esempio:
-Inserire una descrizione su una scritta (passate il puntatore sopra la scritta prova per vedere cosa vuol dire)CODICE<acronym title="INSERISCI QUI LA DESCRIZIONE">Testo prova</acronym>
esempio: Testo prova
-Inserire una scrollbarCODICE<div style="width: 430px; height:60px; overflow: auto">Testo prova
prova!
Ho detto prova!!</div>
esempio:Testo prova
prova!
Ho detto prova!!
Accidenti!
Mi leggi?
Bravo!
Questa è una...
PROVA!
-Mettere un cursore su una scrittaCODICE<div style="cursor: Crosshair">
Testo prova
</div>
esempio:
Testo provaTEXT SHADOW
CODICE<span style="display:block;color:#INSERIRE CODICE COLORE TESTO;text-shadow: #INSERIRE CODICE COLORE OMBRA NUMEROpx NUMEROpx NUMEROpx">Testo prova</span>
Ok. Allora. L'effetto che noi vogliamo ottenere é questo.
TESTO E OMBREGGIATURA GIALLI, 2px 2px 3px
Testo prova
Il codice sopra era in forma generale. A ogni scritta in maiuscolo dovete sostituire qualcosa per modellare il vostro codice. Per ottenere l'effetto sopra riportato, io modifico il codice in questo modo:CODICE<span style="display:block;color:#fff700;text-shadow: #fff700 2px 2px 3px">Testo prova</span>
Diamo un'occhiata confrontando questo codice e quello in forma generale. Al posto di INSERIRE CODICE COLORE TESTO bisogna ovviamente inserire il codice del testo che voi volete. Io ho inserito il codice del colore giallo. Al posto di CODICE COLORE OMBRA bisogna inserire il codice colore per la vostra ombra. Può essere uguale o diverso rispetto a quello del testo.
TESTO GIALLO CON OMBREGGIATURA ROSSA, 2px 2px 3px
Testo prova
Per ottenere questo secondo effetto, il codice é il seguente:CODICE<span style="display:block;color:#fff700;text-shadow: #ff0500 2px 2px 3px">Testo prova</span>
Come vedete, al posto di CODICE COLORE OMBRA prima avevo inserito lo stesso codice della scritta, quello del giallo; adesso ho inserito quello del rosso.
In sostanza, potete inserire qualsiasi colore vogliate sia per il testo sia per l'ombra. Tabella codici colori: Click
Ora vediamo i valori px. Nel codice, come avrete visto, ce ne sono 3.
- Il primo valore px determina la distanza dell'ombra dalla scritta in orizzontale. Più questo valore é alto, più l'ombra sarà proiettata lontano dalla scritta. Se pari a zero, l'ombra coinciderà con la vostra scritta (solo in senso orizzontale).
TESTO E OMBREGGIATURA GIALLI, 10px 2px 3px
Testo provaCODICE<span style="display:block;color:#fff700;text-shadow: #fff700 10px 2px 3px"> Testo prova</span>
Come vedete, l'ombra é molto orientata verso destra. Se volete orientarla verso sinistra, non dovete far altro che mettere un - (sarebbe un segno meno, comunque un trattino) davanti al valore px.
- Il secondo valore px determina il distaccamento dell'ombra in senso verticale. Più é alto, più l'ombra sarà proiettata lontano dalla scritta. Se pari a zero, l'ombra coinciderà con la vostra scritta (solo in senso verticale).
TESTO E OMBREGGIATURA GIALLI, 2px 10px 3px
Testo provaCODICE<span style="display:block;color:#fff700;text-shadow: #fff700 2px 10px 3px"> Testo prova</span>
Anche qui vedete che l'ombra risulta più staccata rispetto ai casi precedenti. Analogamente a prima, basta inserire un meno davanti al valore per far distaccare l'ombra nell'altro senso, ovvero verso l'alto.
- Il terzo valore px determina quanto la proiezione del vostro testo risulterà sfocata. Se questo valore é inserito pari a zero, la scritta equivarrà a una qualsiasi scritta normale, e non sembrerà una vera "ombra":
Testo provaCODICE<span style="display:block;color:#fff700;text-shadow: #fff700 20px 20px 0px"> Testo prova</span>
Come vedete dal codice ho inserito come valori orizzontali e verticali 20px, in questo modo l'ombra é molto distanziata dalla scritta e potete vedere chiaramente che é uguale alla scritta stessa. Ecco invece cosa succede se il terzo valore px é alto:
Testo provaCODICE<span style="display:block;color:#fff700;text-shadow: #fff700 20px 20px 10px"> Testo prova</span>
Visto? Come prima, l'ombra é distanziata, ma molto molto sfocata.
Questo é tutto. Come avrete capito, modificando colori e valori potete ottenere una grande quantità di effetti. Ecco un esempio.
Queste due scritte sono state realizzate con scritta gialla e ombreggiatura rossa, 0px verticali e orizzontali, e diversi valori per il terzo valore px:
Testo provaCODICE<span style="display:block;color:#fff700;text-shadow: #ff0500 0px 0px 0px"> Testo prova</span>
In questo caso, ombra e scritta dunque coincidono. La sfocatura é nulla, e il risultato é una scritta giallo-rossa.
Testo provaCODICE<span style="display:block;color:#fff700;text-shadow: #ff0500 0px 0px 10px"> Testo prova</span>
Qui, invece, la sfocatura é pari a 10px, e abbiamo quindi un alone rosso attorno alla scritta.FINE
.
Codici utili per il forum in HTML |
