-
.
No one should ask you for the name of the one who tells the story
- Group
- Admin
- Posts
- 16,278
- Status
- Anonymous
Qui di seguito potrete consultare una breve lista di codici HTML utili quando si fa una scheda personaggio o si vuole personalizzare la formattazione dei propri post. La lista è in continuo aggiornamento e tratta soprattutto stratagemmi di base con cui chiunque, anche con poca esperienza nel creare codici, pụ giostrarsi e avere un valido aiuto.
Potete prelevare ogni parte dei codici qua sotto presenti senza alcuna necessità di inserire crediti al forum, quindi se ne avete bisogno anche altrove sentitevi liberi di consultare questo catalogo.
Il contributo alla lista è libero, quindi chiunque pụ postare qua sotto se desidera mettere a disposizione della comunità dei codici particolari che sente potrebbero essere utili per gli altri. In caso di codici utili ma confusionari/eccessivamente lunghi, potremmo intervenire per semplificarne la sintassi e renderli più facili da approcciare.
E' opzionale ma particolarmente gradito l'inserimento di codici con piccole spiegazioni su come essi funzionino/che proprietà abbiano.
Tutti i post verranno modificati di volta in volta per poter inserire dei rimandi rapidi nella pagina ai codici interessati.
Link utili:- Vademecum codici HTML: cosa non fare
Font installati
Sito per caratteri speciali di quasi tutti i tipi - MessLetters
Edited by senzanome. - 3/12/2021, 20:00
. -
.
No one should ask you for the name of the one who tells the story
- Group
- Admin
- Posts
- 16,278
- Status
- Anonymous
Menù rapido
Il menù rapido, come si chiama colloquialmente, è un link che rimanda a un punto preciso in una pagina web, che sia la stessa che si sta navigando o un'altra.
Le basi per crearlo sono i codici link:
[Codice collegamento, da cliccare]CODICE<a href="#link1">Deve contenere testo o un'immagine, altrimenti non vi si pụ interagire. Ricordate che per il collegamento serve SEMPRE mettere il CANCELLETTO (#).</a>
[Codice destinazione, dove si arriva dopo aver cliccato]CODICE<a id="link1">pụ o meno contenere testo o un'immagine, ma pụ anche essere posizionato senza nessuna delle due e funziona comunque. Ricordate che per la destinazione NON VA MESSO IL CANCELLETTO (#).</a>
E' anche il codice alla base dell'indice nel primo post di questo topic.
I codici da menù rapido sono particolarmente utili in caso di note a pié di pagina nei vostri post per spiegazioni di vario genere.
E' bene non avere mai due link/destinazioni con lo stesso rimando (es. avete due link e due destinazione entrambe che si chiamano "collegamento1"), perché entrerebbero in conflitto e il secondo link/destinazione verrebbe ignorato a favore del primo esistente nella pagina web.
Un uso particolare dei link rapidi è per creare delle schede personaggio che contengono molte informazioni senza renderle troppo lunghe nella pagina web. Riprendo l'esempio presente nel Vademecum codici HTML:SPOILER (clicca per visualizzare)HTML<div style="overflow: hidden; width:600px; height: 400px; border: 2px solid black;"><a id="link1"></a><div style="overflow: auto; width: 590px; height: 385px; text-align: justify; padding-right: 5px;"><b>Home</b>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ac euismod mauris. Aliquam ac egestas lacus. Quisque a imperdiet neque, id sodales nulla. Quisque vitae lorem sed turpis malesuada mollis quis non risus. Nulla auctor justo arcu, non dictum purus condimentum et. Ut auctor diam mi, nec commodo risus egestas non. Aliquam in pulvinar mauris, nec pellentesque augue. Nam a est id lectus interdum tempor eu sit amet dolor. Ut blandit ullamcorper condimentum.
</div>
<a id="link2"></a><div style="overflow: auto; width: 590px; height: 385px; text-align: justify; padding-right: 5px;"><b>Home2</b>
Mauris sed varius elit. Mauris posuere tincidunt suscipit. Sed non odio quis augue varius auctor. Nunc bibendum ante et cursus viverra. Nulla facilisi. Proin gravida, nulla et consectetur venenatis, purus lectus elementum enim, quis scelerisque justo elit ut neque. Curabitur augue diam, rhoncus ut tincidunt ut, ultricies id urna. Duis faucibus non velit non rutrum. Morbi et diam non tellus placerat gravida. Aliquam mauris sem, vulputate vitae molestie congue, tempus id velit. Duis hendrerit dictum sapien, eu sagittis lacus scelerisque vitae. Aenean a nibh cursus, auctor mauris id, consectetur urna. Interdum et malesuada fames ac ante ipsum primis in faucibus. Duis a enim eu nisi malesuada consequat nec in lectus.</div>
<a id="link3"></a><div style="overflow: auto; width: 590px; height: 385px; text-align: justify; padding-right: 5px;"><b>Home3</b>
Donec sed egestas erat. Mauris laoreet rhoncus mi quis lobortis. Fusce ac eros congue, volutpat ex vel, sodales felis. Donec lacus leo, venenatis ut iaculis vel, facilisis sit amet ex. Nam et accumsan libero. Vivamus lacus erat, mattis non consequat ac, auctor sed justo. In gravida egestas accumsan. Pellentesque et dui accumsan, tristique sapien nec, vehicula mauris. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nam gravida est finibus varius vestibulum. Praesent ac ullamcorper metus, nec bibendum magna. Suspendisse et aliquet magna, consequat tristique elit. Cras eu interdum leo, sed dapibus tellus. Vivamus a bibendum velit.</div>
</div>
<div align=center><a href="#link1">Link1</a> - <a href="#link2">Link2</a> - <a href="#link3">link3</a></div>
Il principio base del codice è avere un DIV di contenimento e vari DIV con le informazioni subordinati ad esso. Il trucco sta nella proprietà overflow: hidden; del DIV di contenimento.
Il DIV di contenimento agisce come una scatola che nasconde quello che sborda: i link rapidi spostano il contenuto della scatola mostrandolo nella pagina web.
I collegamenti possono essere piazzati ovunque si voglia: sopra il DIV di contenimento, sotto o a lato. Funzionano comunque, a patto di piazzarli in un punto che non cambi quando si clicca il collegamento. Quindi inserendoli DENTRO il DIV di contenimento finirebbero per sparire e rendere il codice non funzionale.
I DIV subordinati possono avere delle scroll interne, come nell'esempio qua sopra, o essere fissi, a vostro piacimento.
I DIV subordinati devono essere necessariamente più piccoli del DIV di contenimento. In questo esempio e per questa skin devono essere più stretti di 10 pixel e più bassi di 15 pixel (DIV di contenimento: altezza 400 larghezza 600; DIV subordinati: altezza 385 larghezza 590). Inoltre è inserito un padding a destra di 5 pixel per non tenere il testo attaccato alla barra di scorrimento.. -
.
No one should ask you for the name of the one who tells the story
- Group
- Admin
- Posts
- 16,278
- Status
- Anonymous
Brevissima guida spicciola sulle principali proprietà che potete usare per creare dei codici role/codici scheda.
Partiamo dal principio.
Differenze tra DIV e SPANQuesto è un div.Questo è un div.Questo è un div.
Questo è uno span.Questo è uno span.Questo è uno span.
Apparentemente sono uguali, ma si comportano diversamente. Il codice qua sopra l'ho scritto coś:HTML<div>Questo è un div.</div><div>Questo è un div.</div><div>Questo è un div.</div>
<span>Questo è uno span.</span><span>Questo è uno span.</span><span>Questo è uno span.</span>
Eppure i DIV vanno a capo.
Questo perché, di base e senza specifiche, un DIV è un elemento che si prende tutta la riga dove sta. E' come quando su Word incollate un'immagine e non è contornata dal testo.
Lo SPAN invece è la decorazione del testo. Il grassetto, il colore, il font, e coś via. Non è un'elemento a parte, è una proprietà del testo.
E questo è alla base della principale differenza fra i due codici: lo SPAN non ha un'altezza o una larghezza.
Vi faccio un esempio per vedere come viene. Questi sotto sono lo stesso codice, ma uno è uno SPAN e uno un DIV.
PROVA SPAN
PROVA SPAN
PROVA SPANPROVA DIV
PROVA DIV
PROVA DIVHTML<div style="width: 500px; height: 300px; border: 2px solid black; margin: 10px; padding: 10px; background-color: #ffffff; color: red; line-height: 40px;">PROVA DIV
PROVA DIV
PROVA DIV</div>
Come vedete l'altezza e la larghezza non si applicano.
Questo significa che con un DIV potete fare un codice che contiene tutti gli elementi e agisce da contenitore, mentre uno SPAN influenza solo un'area testo e le sue proprietà.
Altra cosa importante:
- Un DIV pụ essere inserito dentro un altro DIV;
- Uno SPAN pụ essere messo dentro un altro SPAN;
- Uno SPAN pụ essere messo dentro un DIV;
- Un DIV NON PUO' ESSERE MESSO DENTRO UNO SPAN
Codici di base per div e span
Quando fate un codice, ricordate sempre:
- ogni proprietà va chiusa con un ;
- serve SEMPRE scrivere le virgolette a inizio e fine del campo di stile (div style="") senṇ il codice non viene rilevato.
- quando impostate una misura, a volte non viene rilevata se non c'è uno spazio dopo i due punti (width: 50px;), quindi mettetecelo sempre per precauzione.
Spesso se un codice non funziona è possibile aver dimenticato una di queste cose. I codici devono avere una buona sintassi o rischiano di rompersi facilmente.
width
Ne avrete sempre bisogno. "width" indica la larghezza del codice, che pụ essere misurata in pixel o essere relativa alla grandezza della pagina web ed essere impostata in % della misura originale. Se utilizzate le %, non mettete "px" alla fine.
Misurare la grandezza in pixel è utile soprattutto per avere un comportamento preciso e prevedibile del codice, mentre una misura in % lo rende meno prevedibile, ma più adattabile. Cioè se io ho uno schermo a risoluzione più grande, oppure la skin del forum A è più grande che su forum B, una larghezza in % varierà di conseguenza.
Questo è sia un bene che un male:
- è un bene perché potrebbe conservare l'aspetto del codice senza deformare skin o pagine web;
- è un male perché se la pagina web è troppo piccola il codice si sforma e diventa facilmente illeggibile - questo è vero soprattutto per i dispositivi mobili.
Tenete bene in conto che quasi nessuno dei codici qui di seguito funziona alla perfezione su dispositivi mobili, perché questi codici non sono perfettamente responsivi al cambio di risoluzione! Se si riduce troppo possono diventare poco leggibili.
Tuttavia non abbiamo ne lo spazio ne le competenze per fare quel livello di codici responsivi per cui servirebbe tutta una trafila di cose che non abbiamo. Quindi facciamocelo andare bene coś.
Senza impostare una larghezza, un div prende tutto lo spazio che ha a disposizione (che in questo caso è 800 pixel, perché ho incasellato tutto il post in un div largo 800 px).
Un trucco utile quando non si ha tempo di ridimensionare un'immagine è inserirla in un div con larghezza o altezza specificate. In quel modo il contenuto viene ridimensionato automaticamente (a meno che inseriate un overflow, vedete sotto).
senza width
width: 50%;
width: 200px;
immagine ridimensionata width: 300px; (provate ad aprirla in un'altra scheda!)
height
height è l'altezza di un div. Di solito si usa meno della larghezza, ma è importante quando incasellate div uno dentro l'altro o quando dovete impostare delle barre di scorrimento (vedi sotto).
l'immagine di sopra con altezza fissata a 100px (e un overflow)
overflow
L'overflow funziona con i div. Serve a indicare al codice cosa fare se il contenuto è più grande del codice che lo contiene. Premette aver inserito una altezza height, altrimenti non funziona.
overflow: hidden; nasconde quello che sborda.
overflow: auto; crea delle barre di scorrimento. Se il contenuto è anche più largo, le crea anche in orizzontale (succede di solito con le immagini).codice prova
codice prova
codice prova
codice prova
codice prova
codice prova
codice prova
codice prova
codice prova
codice prova
codice prova
codice prova
codice prova
padding
Il padding crea un'area "cuscinetto" interna al div o allo span. Serve perlopiù per dare aria al contenuto ed evitare che tutto sia attaccato in maniera poco estetica/accozzata.
Ricordate che il padding "gonfia" anche verso l'esterno il div, quindi applicando il padding potreste ritrovarvi con un codice più largo e più alto. Fate sempre attenzione e abusate dell'anteprima prima di postare un codice, controllando le misure funzionino.
Il padding pụ essere scritto in vari modi, che vi illustro qua sotto con degli esempi visivi.
padding: 20px;
Un unico numero che specifica il padding per tutti i lati. La soluzione più semplice e veloce. Come vedete dal bordo al contenuto ci sono ogni volta 20 pixel.codice prova
codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova
padding-top: 20px;
Questo codice specifica il padding solo per un lato del codice.
E' possibile specificare padding specifico per ogni lato usando questi tag: padding-top, padding-left, padding-right, padding-bottom.
Questa formattazione serve soprattutto quando vi basta dichiarare il padding di un lato e gli altri lati non vi interessano. O è utile se non siete ancora pratici di HTML.codice prova
codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova
padding: 5px 20px 40px 10px;
Questo è complicato, ma se siete pratici di codici è il più veloce da usare. Un codice del genere indica, in senso orario, la misura di padding da scrivere per ogni lato del codice. Per ricordare:
padding: UP DX DOWN SX
Quindi va in senso orario, partendo dall'alto.
Una misura non dichiarata pụ essere lasciata come 0px.codice prova
codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova codice prova
margin
Il margin crea un po' la stessa cosa del padding, ma all'esterno. Quindi non gonfia il DIV, ma crea una maggiore distanza tra questo e quello che c'è fuori da esso.
Per margin valgono le stesse cose del padding, quindi codici simili sono tutti validi:
- margin: 10px;
- margin-top: 10px;
- margin: 10px 0px 20px 0px;
margin: 20px 0px 0px 40px;
margin e i browser: l'HTML è una cosa stupida
Una cosa da tenere a mente è che noi usiamo l'HTML in un browser web.
I browser web fanno una cosa teoricamente utile, che peṛ va tenuta a mente quando si fa un codice: se degli elementi di codice sono incasellati l'uno dentro l'altro, per evitare un effetto "scaletta", il browser li allinea sul bordo superiore.
Vi faccio un esempio e riporto il codice dell'esempio di margin subito sopra, ma eliminando il bordino nero del contenitore esterno.HTML<div style="background-color: white; border: 1px solid black;"><div style="width: 200px; height: 90px; overflow: hidden; border: 1px solid black; margin: 20px 0px 0px 40px;">codice prova
codice prova
codice prova
codice prova
codice prova
codice prova
codice prova
codice prova
codice prova
codice prova
codice prova
codice prova
codice prova </div></div>
Come vedete pure se ho specificato un margin superiore, il codice non lo usa come prima. Quel che fa il browser in questo caso è applicare il margin a TUTTI gli elementi incasellati spostandoli un po' più giù. Se fate uno screen di questa pagina e misurate su un programma grafico, oppure se avete un tool del browser che vi pụ far prendere le misure, controllate da soli: la distanza tra il riquadro {HTML} e il codice disegnato è effettivamente 20 pixel.
"Come risolvere questo problema?"
In due modi:
1- Imposti un border dello stesso colore del colore di sfondo del tuo codice (se usi background-color: red; metterai border: 1px solid red;)
2- Stessa cosa, ma usi il colore di sfondo della skin. A tal proposito il codice colore è #CBCFD4
color
E' il colore del testo. potete usare i nomi dei colori (red, blue, green, ecc) oppure i codici alfanumerici a sei cifre. Per esempio il nero è "black" oppure "#000000". Per trovare codici colore potete consultare google usando anche il color picker integrato. (Se il link non si apre, basta cercare su google "color picker!)
color: #008000;
letter-spacing
Questo crea una distanza fra le lettere di un testo, regolata in pixel. Utile per i titoli, pessimo per il corpo del testo!
letter-spacing: 5px;
luuuungo
letter-spacing: 15px;
luuuuuunghissimo
border
Il bordo di un div o di uno span, l'elemento grafico che sta tra il padding e il margin.
La sintassi basilare è:HTMLborder: NUMEROpx STILE COLORE;
Che per gli esempi in questo post è, per esempio:HTMLborder: 1px solid black;
il colore pụ essere scritto anche con sequenza alfanumerica (che anzi è il metodo più frequente).
Il bordo pụ essere diverso per ogni lato usando le stesse specifiche più sopra del padding (quindi border-top, border-left, ecc).
Ricordate che fra ogni valore ci va uno spazio, altrimenti il codice non funziona.
Per lo stile ci sono molte varianti:
- dotted lo fa a puntinidotted
- dashed lo fa a trattinidashed
- solid fa un bordo unico e netto (quello usato in questi esempi)solid
- double fa un bordo con una striscia vuota nel mezzodouble
- ridge fa un bordo simile a una corniceridge
- inset crea un bordo simile a un bottone del pc premutoinset
- outset crea un bordo simile a un bottone del pc staticooutset
- groove è come se fosse illuminato da sotto (non saprei come altro descriverlo)groove
background-color
Vi permette di inserire un colore di sfondo. Funziona sia con i colori normali che con i codici alfanumerici.
background-color: white;
background-image: url(INDIRIZZO);
Vi permette di inserire una immagine di sfondo. ATTENZIONE perché è molto facile renda il testo difficile da leggere, quindi dovete usare o immagini preparate o aggiustare il codice in modo che dietro il testo l'area sia chiara e permetta una facile lettura.
Di base l'impostazione in HTML è affinché l'immagine si ripeta continuamente: se volete impostare ripetizioni diverse guardate sotto l'esempio per dei codici da AGGIUNGERE assieme a background-image.
background-repeat: no-repeat;
Per quando avete una immagine che deve apparire una volta sola come sfondo, sia perché è stata preparata coś che per altri motivi.
background-repeat: repeat-x;
Usando questo l'immagine viene ripetuta solo orizzontalmente. E' utile per creare, spesso e volentieri, delle immagini di sfondo che si ripetono in orizzontale stile pattern ma poi devono sparire per permettere leggibilità al resto del testo!
background-repeat: repeat-y;
L'immagine viene ripetuta solo verticalmente. Stesso discorso di repeat-x per l'utilizzo, ma con testo da una parte e immagine dall'altra!
background color RGB+A
Questo è un codice per impostare il codice di sfondo E la trasparenza dello sfondo dell'elemento. E' più complesso da usare perché vanno inseriti i valori di Rosso, Verde e Blu (RGB) del colore scelto, ma è una cosa che potete risolvere facilmente usando il color picker di google o altri programmi di grafica (anche paint lo fa). (Se il link non si apre, basta cercare su google "color picker!)
Il valore "a" sta per "alfa" ed è la trasparenza. Potete settarlo tra 1 e 0.
background: rgba(12, 150, 200, 0.5);
background: rgba(12, 150, 200, 1);
background-image: linear-gradient(direzione, colore 1,2,3);
Fa strano che sia "background-image" e non "background-color", lo so, sbaglierete pure voi, ma l'html è questo.
In ogni caso, questo codice molto carino permette di personalizzare con un gradiente gli elementi a cui viene applicato. Si pụ utilizzare con un angolo di gradiente, con la trasparenza, e usando più colori insieme.
Le direzioni sono "to top, to right, to left, to bottom", ma potete pure mischiare e scrivere tipo "to bottom right" o "to top left" e coś via. Ricordate che specificate il punto d'arrivo, quello dove ci sarà l'ultimo colore specificato.
In alternativa potete usare gli angoli (es 180deg, 90deg, 72deg, ecc), ma se vi fa schifo la geometria le parole vanno bene.
I colori potete definirli "yellow, red, green, blue" come per i font, ma se volete cose più particolari dovete usare il codice RGBA che trovate proprio nel codice sopra a questo. Avrei voluto mettere questo paragrafo sotto background-image, ma meglio una cosa per volta senṇ si ingarbuglia tutto...
Attenzione agli spazi: se mettete uno spazio dopo "gradient" non funziona il codice.
background-image: linear-gradient(yellow, green);
Se non specificate la direzione il gradiente va da sopra a sotto: è la direzione default.
background-image: linear-gradient(to top left, yellow, green);
background-image: linear-gradient(to right, rgba(150,200,0,0), rgba(150,200,0,1));
Potete creare un gradiente sfumato mettendo due volte lo stesso colore, una in completa trasparenza (0) e uno in completa visibilità (1).
background-image: linear-gradient(to right, rgba(150,200,0,0), rgba(150,200,0,1), rgba(150,200,0,0));
E se lo mettete un'altra volta trasparente, potete fare un gradiente doppio :°D
background-image: linear-gradient(90deg, rgba(150,200,0,0), rgba(150,200,0,1), rgba(150,200,0,1), rgba(150,200,0,1), rgba(150,200,0,0));
Potete regolare quanto sfumare e dove mettendo più volte lo stesso colore!
line-height
Interlinea del testo. Crea delle righe più o meno grandi per il testo contenuto in un div o uno span.
La regola di base è che l'interlinea per rendere il testo facilmente leggibile dovrebbe essere 2-3 pixel più grande della misura della grandezza font. Quindi se inserite font size: 15px; metterete line-height: 18px;
In caso utilizziate grandezze del testo diverse è bene fare attenzione all'interlinea che usate perché spesso e volentieri questa non cambia al cambiare della grandezza testo (vedi esempi sotto).
line-height: 20px;
line-height: 15px;
font size
La grandezza del font che utilizzate.
LE misure che potete usare sono tante - qualcuno di voi avrà visto "pt" come misura in alcuni codici nel circuito - ma vi consiglio di utilizzare il più delle volte i pixel, che come misura a schermo sono facilmente misurabili. I Pixel si scrivono "px", e sono la stessa misura usata in tutti gli altri codici in questo post.
font-size: 10px;
font-size: 30px;
Edited by senzanome. - 18/11/2020, 12:25. -
.
No one should ask you for the name of the one who tells the story
- Group
- Admin
- Posts
- 16,278
- Status
- Anonymous
Colori in BBCode
I codici qua sotto sono utilizzabili nel semplice codice disponibile su forumfree [color], basta sostituire il colore che vi da forumfree con le parole scritte qua sotto o il codice alfanumerico con cancelletto (es. #800000). Funzionano anche nei div e negli span (poiché forumfree interpreta il bbcode, ma altrove potrebbero non funzionare i codici come parole).
I colori sono elencati in ordine alfabetico.Alicewhite | F0F8FF
Antiquewhite | FAEBD7
Aqua | 00FFFF
Aquamarine | 7FFFD4
Azure | F0FFFF
Beige | F5F5DC
Bisque | FFE4C4
Blanchedalmond | FFEBCD
Blue | 0000FF
Blueviolet | 8A2BE2
Brown | A52A2A
Burlywood | DEB887
Cadetblue | 5F9EA0
Chartreuse | 7FFF00
Chocolate | D2691E
Coral | FF7F50
Cornflowerblue | 6495ED
Cornsilk | FFF8DC
Crimson | DC143C
Cyan | 00FFFF
Darkblue | 00008B
Darkcyan | 008B8B
Darkgoldenrod | B8860B
Darkgray | A9A9A9
Darkgreen | 006400
Darkkhaki | BDB76B
Darkmagenta | 8B008B
Darkolivegreen | 556B2F
Darkorange | FF8C00
Darkorchid | 9932CC
Darkred | 8B0000
Darksalmon | E9967A
Darkseagreen | 8FBC8F
Darkslateblue | 483D8BDarkslategray | 2F4F4F
Darkturquoise | 00CED1
Darkviolet | 9400D3
Deeppink | FF1493
Deepskyblue | 00BFFF
Dimgray | 696969
Dodgerblue | 1E90FF
Firebrick | B22222
Floralwhite | FFFAF0
Forestgreen | 228B22
Fuchsia | FF00FF
Gainsboro | DCDCDC
Ghostwhite | F8F8FF
Gold | FFD700
Goldenrod | DAA520
Gray | 808080
Green | 008000
Greenyellow | ADFF2F
Honeydew | F0FFF0
Hotpink | FF69B4
Indianred | CD5C5C
Indigo | 4B0082
Ivory | FFFFF0
Khaki | F0E68C
Lavender | E6E6FA
Lavenderblush | FFF0F5
Lawngreen | 7CFC00
Lemonchiffon | FFFACD
Lightblue | ADD8E6
Lightcoral | F08080
Lightcyan | E0FFFF
Lightgoldenrodyellow | FAFAD2
Lightgreen | 90EE90
Lightgrey | D3D3D3Lightpink | FFB6C1
Lightsalmon | FFA07A
Lightseagreen | 20B2AA
Lightskyblue | 87CEFA
Lightslategray | 778899
Lightsteelblue | B0C4DE]
Linen | FAF0E6
Magenta | FF00FF
Maroon | 800000
Mediumaquamarine | 66CDAA
Mediumblue | 0000CD
Mediumorchid | BA55D3
Mediumpurple | 9370D8
Mediumseagreen | 3CB371
Mediumslateblue | 7B68EE
Mediumspringgreen | 00FA9A
Mediumturquoise | 48D1CC
Mediumvioletred | C71585
Midnightblue | 191970
Mintcream | F5FFFA
Mistyrose | FFE4E1
Moccasin | FFE4B5
Navajowhite | FFDEAD
Navy | 000080
Oldlace | FDF5E6
Olive | 808000
Olivedrab | 688E23
Orange | FFA500
Orangered | FF4500
Orchid | DA70D6
Palegoldenrod | EEE8AA
Palegreen | 98FB98
Paleturquoise | AFEEEE
Palevioletred | D87093Papayawhip | FFEFD5
Peachpuff | FFDAB9
Peru | CD853F
Pink | FFC0CB
Plum | DDA0DD
Powderblue | B0E0E6
Purple | 800080
Red | FF0000
Rosybrown | BC8F8F
Royalblue | 4169E1
Saddlebrown | 8B4513
Salmon | FA8072
Sandybrown | F4A460
Seagreen | 2E8B57
Seashell | FFF5EE
Sienna | A0522D
Silver | C0C0C0
Skyblue | 87CEEB
Slateblue | 6A5ACD
Slategray | 708090
Snow | FFFAFA
Springgreen | 00FF7F
Steelblue | 4682B4
Tan | D2B48C
Teal | 008080
Thistle | D8BFD8
Tomato | FF6347
Turquoise | 40E0D0
Violet | EE82EE
Wheat | F5DEB3
White | FFFFFF
Whitesmoke | F5F5F5
Yellow | FFFF00
Yellowgreen | 9ACD32
Tabella senza colore per confronto con il fondo della skin:Alicewhite | F0F8FF
Antiquewhite | FAEBD7
Aqua | 00FFFF
Aquamarine | 7FFFD4
Azure | F0FFFF
Beige | F5F5DC
Bisque | FFE4C4
Blanchedalmond | FFEBCD
Blue | 0000FF
Blueviolet | 8A2BE2
Brown | A52A2A
Burlywood | DEB887
Cadetblue | 5F9EA0
Chartreuse | 7FFF00
Chocolate | D2691E
Coral | FF7F50
Cornflowerblue | 6495ED
Cornsilk | FFF8DC
Crimson | DC143C
Cyan | 00FFFF
Darkblue | 00008B
Darkcyan | 008B8B
Darkgoldenrod | B8860B
Darkgray | A9A9A9
Darkgreen | 006400
Darkkhaki | BDB76B
Darkmagenta | 8B008B
Darkolivegreen | 556B2F
Darkorange | FF8C00
Darkorchid | 9932CC
Darkred | 8B0000
Darksalmon | E9967A
Darkseagreen | 8FBC8F
Darkslateblue | 483D8BDarkslategray | 2F4F4F
Darkturquoise | 00CED1
Darkviolet | 9400D3
Deeppink | FF1493
Deepskyblue | 00BFFF
Dimgray | 696969
Dodgerblue | 1E90FF
Firebrick | B22222
Floralwhite | FFFAF0
Forestgreen | 228B22
Fuchsia | FF00FF
Gainsboro | DCDCDC
Ghostwhite | F8F8FF
Gold | FFD700
Goldenrod | DAA520
Gray | 808080
Green | 008000
Greenyellow | ADFF2F
Honeydew | F0FFF0
Hotpink | FF69B4
Indianred | CD5C5C
Indigo | 4B0082
Ivory | FFFFF0
Khaki | F0E68C
Lavender | E6E6FA
Lavenderblush | FFF0F5
Lawngreen | 7CFC00
Lemonchiffon | FFFACD
Lightblue | ADD8E6
Lightcoral | F08080
Lightcyan | E0FFFF
Lightgoldenrodyellow | FAFAD2
Lightgreen | 90EE90
Lightgrey | D3D3D3Lightpink | FFB6C1
Lightsalmon | FFA07A
Lightseagreen | 20B2AA
Lightskyblue | 87CEFA
Lightslategray | 778899
Lightsteelblue | B0C4DE]
Linen | FAF0E6
Magenta | FF00FF
Maroon | 800000
Mediumaquamarine | 66CDAA
Mediumblue | 0000CD
Mediumorchid | BA55D3
Mediumpurple | 9370D8
Mediumseagreen | 3CB371
Mediumslateblue | 7B68EE
Mediumspringgreen | 00FA9A
Mediumturquoise | 48D1CC
Mediumvioletred | C71585
Midnightblue | 191970
Mintcream | F5FFFA
Mistyrose | FFE4E1
Moccasin | FFE4B5
Navajowhite | FFDEAD
Navy | 000080
Oldlace | FDF5E6
Olive | 808000
Olivedrab | 688E23
Orange | FFA500
Orangered | FF4500
Orchid | DA70D6
Palegoldenrod | EEE8AA
Palegreen | 98FB98
Paleturquoise | AFEEEE
Palevioletred | D87093Papayawhip | FFEFD5
Peachpuff | FFDAB9
Peru | CD853F
Pink | FFC0CB
Plum | DDA0DD
Powderblue | B0E0E6
Purple | 800080
Red | FF0000
Rosybrown | BC8F8F
Royalblue | 4169E1
Saddlebrown | 8B4513
Salmon | FA8072
Sandybrown | F4A460
Seagreen | 2E8B57
Seashell | FFF5EE
Sienna | A0522D
Silver | C0C0C0
Skyblue | 87CEEB
Slateblue | 6A5ACD
Slategray | 708090
Snow | FFFAFA
Springgreen | 00FF7F
Steelblue | 4682B4
Tan | D2B48C
Teal | 008080
Thistle | D8BFD8
Tomato | FF6347
Turquoise | 40E0D0
Violet | EE82EE
Wheat | F5DEB3
White | FFFFFF
Whitesmoke | F5F5F5
Yellow | FFFF00
Yellowgreen | 9ACD32
Edited by senzanome. - 14/3/2020, 03:03. -
.
No one should ask you for the name of the one who tells the story
- Group
- Admin
- Posts
- 16,278
- Status
- Anonymous
Details e Summary: Spoiler personalizzati
O più o meno è quel che si pụ definire questo tipo di codice.
Details permette di inserire un contenuto a scomparsa, che viene richiamato cliccando sull'elemento contenuto dentro Summary.Ciao, io sono uno spoiler!
Non è vero ma non rivelare la mia identità segreta ti pregoHTML<details><summary><b>Ciao, io sono uno spoiler!</b></summary>
Non è vero ma non rivelare la mia identità segreta ti prego</details>
E questo basta per capire come funziona il codice.
Pụ essere personalizzato in molti modi e racchiudere contenuti anche di grandi dimensioni.
Summary pụ essere personalizzato con uno style, mentre details è solo un contenitore.CHE SCRITTA INQUIETANTE
Ma per fortuna non c'era nulla di cui preoccupar- ODDIO NO CORRI SCAPPA FEHOR E LA SUA COLLEZIONE DI LOLI EREDI AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
SPOILER (clicca per visualizzare)Nessuna divinità è stata maltrattata senza consenso nella realizzazione di questo codice.HTML<details><summary style="width: 400px; font-size: 10px; font-family: cambria; color: white; background-color: darkred; text-shadow: #222 0px 0px 3px; text-align: center; padding: 10px;"><b>CHE SCRITTA INQUIETANTE</b></summary>
<div align=center><div style="padding: 10px; text-align: justify; font-family: cambria; color: black; font-size: 14px; line-height: 14x;">Ma per fortuna non c'era nulla di cui preoccupar- ODDIO NO CORRI SCAPPA FEHOR E LA SUA COLLEZIONE DI EREDI LOLI AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
</div>
[IMG]https://impeccabletablemanners.files.wordpress.com/2016/05/monkey-puppet-omg-shock-gif.gif[/IMG]</div>
[SPOILER]Nessuna divinità è stata maltrattata senza consenso nella realizzazione di questo codice.[/SPOILER]</details>. -
.
No one should ask you for the name of the one who tells the story
- Group
- Admin
- Posts
- 16,278
- Status
- Anonymous
Scheda preconfezionata 1 - Celeste geometrico
Stasera sto una chiavica quindi preferisco fare un po' di codicilli senza pensare troppo.
Godeteveli se possono servire pupetti
Potete usare qualsiasi immagine vi pare, basta che sia quadrata o allungata.
Se è troppo grande, verrà automaticamente tagliata, quindi sentitevi belli sicuri.
Nome
Cognome• Razza:
• Genere:
• Orientamento:
• Data e Luogo di Nascita:
• Fazione d'appartenenza:
• Segno Zodiacale:
• Luogo di Residenza:
• Segno Zodiacale:
• Prima Classe:
• Seconda Classe:
• Grado:
• Energia:
• Soul Points:
• Punti Esperienza:
• Fama/Notorietà: Lettera/Numero
• Descrizione fama:blablablablabla Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst. In vehicula augue eros, sed tempus nulla efficitur suscipit. Phasellus lobortis bibendum tortor ac eleifend. Donec massa sapien, cursus sed lacinia sed, tincidunt non ipsum. Duis in ante euismod, semper urna a, varius ligula. Vivamus quis tincidunt arcu. Mauris quis mauris eget urna sagittis suscipit id in metus. Sed non mauris in ipsum ornare iaculis. Quisque vel ligula at risus euismod iaculis eu vitae eros. Donec lacinia leo sed metus consequat, non eleifend nibh vehicula.
Ut non lectus laoreet, dignissim velit sit amet, imperdiet nisl. Mauris suscipit et nulla maximus feugiat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed efficitur lacus sit amet hendrerit mattis. Etiam malesuada in mauris aliquam condimentum. Sed quis odio eros. Nunc eget viverra velit, et cursus erat. Aenean nec sapien tristique, accumsan orci a, vehicula sem. Mauris efficitur leo et turpis congue vulputate.
Nunc quis sodales nisi. Morbi ac tincidunt diam, a convallis justo. Nam tortor sem, eleifend sit amet ultricies vitae, fringilla vitae ante. Donec eu massa a leo volutpat molestie a ac mi. Sed mattis lectus ut elementum lobortis. Fusce interdum, enim vitae viverra iaculis, eros arcu maximus ex, in fermentum nisi dolor scelerisque ex. Nulla vitae velit sit amet lacus tincidunt mollis et ac purus. Etiam volutpat varius justo, in efficitur nunc pharetra nec. Sed vulputate nisi nec ultrices mollis. Donec at commodo dui, at aliquam risus.Fisico
• Segni Particolari:
• Vestiario:
blablablablabla Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst. In vehicula augue eros, sed tempus nulla efficitur suscipit. Phasellus lobortis bibendum tortor ac eleifend. Donec massa sapien, cursus sed lacinia sed, tincidunt non ipsum. Duis in ante euismod, semper urna a, varius ligula. Vivamus quis tincidunt arcu. Mauris quis mauris eget urna sagittis suscipit id in metus. Sed non mauris in ipsum ornare iaculis. Quisque vel ligula at risus euismod iaculis eu vitae eros. Donec lacinia leo sed metus consequat, non eleifend nibh vehicula.
Ut non lectus laoreet, dignissim velit sit amet, imperdiet nisl. Mauris suscipit et nulla maximus feugiat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed efficitur lacus sit amet hendrerit mattis. Etiam malesuada in mauris aliquam condimentum. Sed quis odio eros. Nunc eget viverra velit, et cursus erat. Aenean nec sapien tristique, accumsan orci a, vehicula sem. Mauris efficitur leo et turpis congue vulputate.
Nunc quis sodales nisi. Morbi ac tincidunt diam, a convallis justo. Nam tortor sem, eleifend sit amet ultricies vitae, fringilla vitae ante. Donec eu massa a leo volutpat molestie a ac mi. Sed mattis lectus ut elementum lobortis. Fusce interdum, enim vitae viverra iaculis, eros arcu maximus ex, in fermentum nisi dolor scelerisque ex. Nulla vitae velit sit amet lacus tincidunt mollis et ac purus. Etiam volutpat varius justo, in efficitur nunc pharetra nec. Sed vulputate nisi nec ultrices mollis. Donec at commodo dui, at aliquam risus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst. In vehicula augue eros, sed tempus nulla efficitur suscipit. Phasellus lobortis bibendum tortor ac eleifend. Donec massa sapien, cursus sed lacinia sed, tincidunt non ipsum. Duis in ante euismod, semper urna a, varius ligula. Vivamus quis tincidunt arcu. Mauris quis mauris eget urna sagittis suscipit id in metus. Sed non mauris in ipsum ornare iaculis. Quisque vel ligula at risus euismod iaculis eu vitae eros. Donec lacinia leo sed metus consequat, non eleifend nibh vehicula.
Ut non lectus laoreet, dignissim velit sit amet, imperdiet nisl. Mauris suscipit et nulla maximus feugiat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed efficitur lacus sit amet hendrerit mattis. Etiam malesuada in mauris aliquam condimentum. Sed quis odio eros. Nunc eget viverra velit, et cursus erat. Aenean nec sapien tristique, accumsan orci a, vehicula sem. Mauris efficitur leo et turpis congue vulputate.
Nunc quis sodales nisi. Morbi ac tincidunt diam, a convallis justo. Nam tortor sem, eleifend sit amet ultricies vitae, fringilla vitae ante. Donec eu massa a leo volutpat molestie a ac mi. Sed mattis lectus ut elementum lobortis. Fusce interdum, enim vitae viverra iaculis, eros arcu maximus ex, in fermentum nisi dolor scelerisque ex. Nulla vitae velit sit amet lacus tincidunt mollis et ac purus. Etiam volutpat varius justo, in efficitur nunc pharetra nec. Sed vulputate nisi nec ultrices mollis. Donec at commodo dui, at aliquam risus.Psiche
• Allineamento:
• Obbiettivi:
• Morale:
• Motto:
• Credo e Fede:
blablablablabla Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst. In vehicula augue eros, sed tempus nulla efficitur suscipit. Phasellus lobortis bibendum tortor ac eleifend. Donec massa sapien, cursus sed lacinia sed, tincidunt non ipsum. Duis in ante euismod, semper urna a, varius ligula. Vivamus quis tincidunt arcu. Mauris quis mauris eget urna sagittis suscipit id in metus. Sed non mauris in ipsum ornare iaculis. Quisque vel ligula at risus euismod iaculis eu vitae eros. Donec lacinia leo sed metus consequat, non eleifend nibh vehicula.
Ut non lectus laoreet, dignissim velit sit amet, imperdiet nisl. Mauris suscipit et nulla maximus feugiat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed efficitur lacus sit amet hendrerit mattis. Etiam malesuada in mauris aliquam condimentum. Sed quis odio eros. Nunc eget viverra velit, et cursus erat. Aenean nec sapien tristique, accumsan orci a, vehicula sem. Mauris efficitur leo et turpis congue vulputate.
Nunc quis sodales nisi. Morbi ac tincidunt diam, a convallis justo. Nam tortor sem, eleifend sit amet ultricies vitae, fringilla vitae ante. Donec eu massa a leo volutpat molestie a ac mi. Sed mattis lectus ut elementum lobortis. Fusce interdum, enim vitae viverra iaculis, eros arcu maximus ex, in fermentum nisi dolor scelerisque ex. Nulla vitae velit sit amet lacus tincidunt mollis et ac purus. Etiam volutpat varius justo, in efficitur nunc pharetra nec. Sed vulputate nisi nec ultrices mollis. Donec at commodo dui, at aliquam risus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst. In vehicula augue eros, sed tempus nulla efficitur suscipit. Phasellus lobortis bibendum tortor ac eleifend. Donec massa sapien, cursus sed lacinia sed, tincidunt non ipsum. Duis in ante euismod, semper urna a, varius ligula. Vivamus quis tincidunt arcu. Mauris quis mauris eget urna sagittis suscipit id in metus. Sed non mauris in ipsum ornare iaculis. Quisque vel ligula at risus euismod iaculis eu vitae eros. Donec lacinia leo sed metus consequat, non eleifend nibh vehicula.
Ut non lectus laoreet, dignissim velit sit amet, imperdiet nisl. Mauris suscipit et nulla maximus feugiat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed efficitur lacus sit amet hendrerit mattis. Etiam malesuada in mauris aliquam condimentum. Sed quis odio eros. Nunc eget viverra velit, et cursus erat. Aenean nec sapien tristique, accumsan orci a, vehicula sem. Mauris efficitur leo et turpis congue vulputate.
Nunc quis sodales nisi. Morbi ac tincidunt diam, a convallis justo. Nam tortor sem, eleifend sit amet ultricies vitae, fringilla vitae ante. Donec eu massa a leo volutpat molestie a ac mi. Sed mattis lectus ut elementum lobortis. Fusce interdum, enim vitae viverra iaculis, eros arcu maximus ex, in fermentum nisi dolor scelerisque ex. Nulla vitae velit sit amet lacus tincidunt mollis et ac purus. Etiam volutpat varius justo, in efficitur nunc pharetra nec. Sed vulputate nisi nec ultrices mollis. Donec at commodo dui, at aliquam risus.Backgroundblablablablabla lorem ipsum
blablablablabla Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst. In vehicula augue eros, sed tempus nulla efficitur suscipit. Phasellus lobortis bibendum tortor ac eleifend. Donec massa sapien, cursus sed lacinia sed, tincidunt non ipsum. Duis in ante euismod, semper urna a, varius ligula. Vivamus quis tincidunt arcu. Mauris quis mauris eget urna sagittis suscipit id in metus. Sed non mauris in ipsum ornare iaculis. Quisque vel ligula at risus euismod iaculis eu vitae eros. Donec lacinia leo sed metus consequat, non eleifend nibh vehicula.
Ut non lectus laoreet, dignissim velit sit amet, imperdiet nisl. Mauris suscipit et nulla maximus feugiat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed efficitur lacus sit amet hendrerit mattis. Etiam malesuada in mauris aliquam condimentum. Sed quis odio eros. Nunc eget viverra velit, et cursus erat. Aenean nec sapien tristique, accumsan orci a, vehicula sem. Mauris efficitur leo et turpis congue vulputate.
Nunc quis sodales nisi. Morbi ac tincidunt diam, a convallis justo. Nam tortor sem, eleifend sit amet ultricies vitae, fringilla vitae ante. Donec eu massa a leo volutpat molestie a ac mi. Sed mattis lectus ut elementum lobortis. Fusce interdum, enim vitae viverra iaculis, eros arcu maximus ex, in fermentum nisi dolor scelerisque ex. Nulla vitae velit sit amet lacus tincidunt mollis et ac purus. Etiam volutpat varius justo, in efficitur nunc pharetra nec. Sed vulputate nisi nec ultrices mollis. Donec at commodo dui, at aliquam risus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst. In vehicula augue eros, sed tempus nulla efficitur suscipit. Phasellus lobortis bibendum tortor ac eleifend. Donec massa sapien, cursus sed lacinia sed, tincidunt non ipsum. Duis in ante euismod, semper urna a, varius ligula. Vivamus quis tincidunt arcu. Mauris quis mauris eget urna sagittis suscipit id in metus. Sed non mauris in ipsum ornare iaculis. Quisque vel ligula at risus euismod iaculis eu vitae eros. Donec lacinia leo sed metus consequat, non eleifend nibh vehicula.
Ut non lectus laoreet, dignissim velit sit amet, imperdiet nisl. Mauris suscipit et nulla maximus feugiat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed efficitur lacus sit amet hendrerit mattis. Etiam malesuada in mauris aliquam condimentum. Sed quis odio eros. Nunc eget viverra velit, et cursus erat. Aenean nec sapien tristique, accumsan orci a, vehicula sem. Mauris efficitur leo et turpis congue vulputate.
Nunc quis sodales nisi. Morbi ac tincidunt diam, a convallis justo. Nam tortor sem, eleifend sit amet ultricies vitae, fringilla vitae ante. Donec eu massa a leo volutpat molestie a ac mi. Sed mattis lectus ut elementum lobortis. Fusce interdum, enim vitae viverra iaculis, eros arcu maximus ex, in fermentum nisi dolor scelerisque ex. Nulla vitae velit sit amet lacus tincidunt mollis et ac purus. Etiam volutpat varius justo, in efficitur nunc pharetra nec. Sed vulputate nisi nec ultrices mollis. Donec at commodo dui, at aliquam risus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst. In vehicula augue eros, sed tempus nulla efficitur suscipit. Phasellus lobortis bibendum tortor ac eleifend. Donec massa sapien, cursus sed lacinia sed, tincidunt non ipsum. Duis in ante euismod, semper urna a, varius ligula. Vivamus quis tincidunt arcu. Mauris quis mauris eget urna sagittis suscipit id in metus. Sed non mauris in ipsum ornare iaculis. Quisque vel ligula at risus euismod iaculis eu vitae eros. Donec lacinia leo sed metus consequat, non eleifend nibh vehicula.
Ut non lectus laoreet, dignissim velit sit amet, imperdiet nisl. Mauris suscipit et nulla maximus feugiat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed efficitur lacus sit amet hendrerit mattis. Etiam malesuada in mauris aliquam condimentum. Sed quis odio eros. Nunc eget viverra velit, et cursus erat. Aenean nec sapien tristique, accumsan orci a, vehicula sem. Mauris efficitur leo et turpis congue vulputate.
Nunc quis sodales nisi. Morbi ac tincidunt diam, a convallis justo. Nam tortor sem, eleifend sit amet ultricies vitae, fringilla vitae ante. Donec eu massa a leo volutpat molestie a ac mi. Sed mattis lectus ut elementum lobortis. Fusce interdum, enim vitae viverra iaculis, eros arcu maximus ex, in fermentum nisi dolor scelerisque ex. Nulla vitae velit sit amet lacus tincidunt mollis et ac purus. Etiam volutpat varius justo, in efficitur nunc pharetra nec. Sed vulputate nisi nec ultrices mollis. Donec at commodo dui, at aliquam risus.Oppure citazione citazione citazioneTotale Corpo
Mente
Spirito
Velocità
Destrezza000
000
000
000
000000 Razza + 000 Classe + 000 Energia + 000 Abilità + 000 Altro
000 Razza + 000 Classe + 000 Energia + 000 Abilità + 000 Altro
000 Razza + 000 Classe + 000 Energia + 000 Abilità + 000 Altro
000 Razza + 000 Classe + 000 Energia + 000 Abilità + 000 Altro
000 Razza + 000 Classe + 000 Energia + 000 Abilità + 000 AltroCorpo: Danni Bassi/Medi/Alti/Critici + x° livello Potere passivo
Mente: Danni Bassi/Medi/Alti/Critici + x° livello Potere passivo
Spirito: Danni Bassi/Medi/Alti/Critici + x° livello Potere passivoOppure citazione citazione citazione
Nome creaturo• Specie:
• Genere:
• Tipo:
• Dimensioni:- - Altezza al garrese:
- Altezza terra/testa:
- Lunghezza: (coda esclusa)
- Coda:
- Peso:
• Ceppo Classe d'Appartenenza:
• Energia:
• Soul Points:
• Punti Esperienza:Fisico e Psiche• Fisico:
Ut non lectus laoreet, dignissim velit sit amet, imperdiet nisl. Mauris suscipit et nulla maximus feugiat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed efficitur lacus sit amet hendrerit mattis. Etiam malesuada in mauris aliquam condimentum. Sed quis odio eros. Nunc eget viverra velit, et cursus erat. Aenean nec sapien tristique, accumsan orci a, vehicula sem. Mauris efficitur leo et turpis congue vulputate.
Nunc quis sodales nisi. Morbi ac tincidunt diam, a convallis justo. Nam tortor sem, eleifend sit amet ultricies vitae, fringilla vitae ante. Donec eu massa a leo volutpat molestie a ac mi. Sed mattis lectus ut elementum lobortis. Fusce interdum, enim vitae viverra iaculis, eros arcu maximus ex, in fermentum nisi dolor scelerisque ex. Nulla vitae velit sit amet lacus tincidunt mollis et ac purus. Etiam volutpat varius justo, in efficitur nunc pharetra nec. Sed vulputate nisi nec ultrices mollis. Donec at commodo dui, at aliquam risus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst. In vehicula augue eros, sed tempus nulla efficitur suscipit. Phasellus lobortis bibendum tortor ac eleifend. Donec massa sapien, cursus sed lacinia sed, tincidunt non ipsum. Duis in ante euismod, semper urna a, varius ligula. Vivamus quis tincidunt arcu. Mauris quis mauris eget urna sagittis suscipit id in metus. Sed non mauris in ipsum ornare iaculis. Quisque vel ligula at risus euismod iaculis eu vitae eros. Donec lacinia leo sed metus consequat, non eleifend nibh vehicula.Ut non lectus laoreet, dignissim velit sit amet, imperdiet nisl. Mauris suscipit et nulla maximus feugiat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed efficitur lacus sit amet hendrerit mattis. Etiam malesuada in mauris aliquam condimentum. Sed quis odio eros. Nunc eget viverra velit, et cursus erat. Aenean nec sapien tristique, accumsan orci a, vehicula sem. Mauris efficitur leo et turpis congue vulputate.
• Psiche:
Nunc quis sodales nisi. Morbi ac tincidunt diam, a convallis justo. Nam tortor sem, eleifend sit amet ultricies vitae, fringilla vitae ante. Donec eu massa a leo volutpat molestie a ac mi. Sed mattis lectus ut elementum lobortis. Fusce interdum, enim vitae viverra iaculis, eros arcu maximus ex, in fermentum nisi dolor scelerisque ex. Nulla vitae velit sit amet lacus tincidunt mollis et ac purus. Etiam volutpat varius justo, in efficitur nunc pharetra nec. Sed vulputate nisi nec ultrices mollis. Donec at commodo dui, at aliquam risus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst. In vehicula augue eros, sed tempus nulla efficitur suscipit. Phasellus lobortis bibendum tortor ac eleifend. Donec massa sapien, cursus sed lacinia sed, tincidunt non ipsum. Duis in ante euismod, semper urna a, varius ligula. Vivamus quis tincidunt arcu. Mauris quis mauris eget urna sagittis suscipit id in metus. Sed non mauris in ipsum ornare iaculis. Quisque vel ligula at risus euismod iaculis eu vitae eros. Donec lacinia leo sed metus consequat, non eleifend nibh vehicula.Totale Corpo
Mente
Spirito
Velocità
Destrezza000
000
000
000
000000 Razza + 000 Classe + 000 Energia + 000 Abilità + 000 Altro
000 Razza + 000 Classe + 000 Energia + 000 Abilità + 000 Altro
000 Razza + 000 Classe + 000 Energia + 000 Abilità + 000 Altro
000 Razza + 000 Classe + 000 Energia + 000 Abilità + 000 Altro
000 Razza + 000 Classe + 000 Energia + 000 Abilità + 000 AltroCorpo: Danni Bassi/Medi/Alti/Critici + x° livello Potere passivo
Mente: Danni Bassi/Medi/Alti/Critici + x° livello Potere passivo
Spirito: Danni Bassi/Medi/Alti/Critici + x° livello Potere passivoAbilità • Tecniche • ComandiNome dell'Abilità
Descrizione Descrizione Descrizione Descrizione Descrizione Descrizione
Tipo di Abilità: Matrice, Percezione, ecc
Ut non lectus laoreet, dignissim velit sit amet, imperdiet nisl. Mauris suscipit et nulla maximus feugiat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed efficitur lacus sit amet hendrerit mattis. Etiam malesuada in mauris aliquam condimentum. Sed quis odio eros. Nunc eget viverra velit, et cursus erat. Aenean nec sapien tristique, accumsan orci a, vehicula sem. Mauris efficitur leo et turpis congue vulputate.
Nome della Tecnica
Tipo di tecnica
Descrizione Descrizione Descrizione Descrizione Descrizione Descrizione
Raggio:
Consumo:
Matrice:
Nunc quis sodales nisi. Morbi ac tincidunt diam, a convallis justo. Nam tortor sem, eleifend sit amet ultricies vitae, fringilla vitae ante. Donec eu massa a leo volutpat molestie a ac mi. Sed mattis lectus ut elementum lobortis. Fusce interdum, enim vitae viverra iaculis, eros arcu maximus ex, in fermentum nisi dolor scelerisque ex. Nulla vitae velit sit amet lacus tincidunt mollis et ac purus. Etiam volutpat varius justo, in efficitur nunc pharetra nec. Sed vulputate nisi nec ultrices mollis. Donec at commodo dui, at aliquam risus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst. In vehicula augue eros, sed tempus nulla efficitur suscipit. Phasellus lobortis bibendum tortor ac eleifend. Donec massa sapien, cursus sed lacinia sed, tincidunt non ipsum. Duis in ante euismod, semper urna a, varius ligula. Vivamus quis tincidunt arcu. Mauris quis mauris eget urna sagittis suscipit id in metus. Sed non mauris in ipsum ornare iaculis. Quisque vel ligula at risus euismod iaculis eu vitae eros. Donec lacinia leo sed metus consequat, non eleifend nibh vehicula.Ut non lectus laoreet, dignissim velit sit amet, imperdiet nisl. Mauris suscipit et nulla maximus feugiat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed efficitur lacus sit amet hendrerit mattis. Etiam malesuada in mauris aliquam condimentum. Sed quis odio eros. Nunc eget viverra velit, et cursus erat. Aenean nec sapien tristique, accumsan orci a, vehicula sem. Mauris efficitur leo et turpis congue vulputate.
Nunc quis sodales nisi. Morbi ac tincidunt diam, a convallis justo. Nam tortor sem, eleifend sit amet ultricies vitae, fringilla vitae ante. Donec eu massa a leo volutpat molestie a ac mi. Sed mattis lectus ut elementum lobortis. Fusce interdum, enim vitae viverra iaculis, eros arcu maximus ex, in fermentum nisi dolor scelerisque ex. Nulla vitae velit sit amet lacus tincidunt mollis et ac purus. Etiam volutpat varius justo, in efficitur nunc pharetra nec. Sed vulputate nisi nec ultrices mollis. Donec at commodo dui, at aliquam risus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst. In vehicula augue eros, sed tempus nulla efficitur suscipit. Phasellus lobortis bibendum tortor ac eleifend. Donec massa sapien, cursus sed lacinia sed, tincidunt non ipsum. Duis in ante euismod, semper urna a, varius ligula. Vivamus quis tincidunt arcu. Mauris quis mauris eget urna sagittis suscipit id in metus. Sed non mauris in ipsum ornare iaculis. Quisque vel ligula at risus euismod iaculis eu vitae eros. Donec lacinia leo sed metus consequat, non eleifend nibh vehicula.Nome prestavolto e link: Nome e immagine
Fonte prestavolto: Opera/Libro
(c) Entropia GDR. Modifica e utilizzo consentiti, peṛ lasciatecelo un link dai.SPOILER (clicca per visualizzare)HTML<div style="width: 800px; font-family: cambria; color: #000; font-size: 14px; line-height: 16px; background-image: url(https://upload.forumfree.net/i/fc9161612/pattern_prova_2.png); border-top: 15px solid black; border-bottom: 15px solid black;">
<div style="width: 650px; background: rgba(255, 255, 255, 0.8); padding: 0px 30px 30px 30px;">
<div style="float: right; width: 300px; height: 300px; overflow: hidden; margin-left: 10px; margin-right: 10px; border: 5px solid #2e94ab;">[IMG]https://cdn.shopify.com/s/files/1/0533/2089/files/placeholder-images-image_large.png?format=jpg&quality=90&v=1530129081[/IMG]</div>
<span style="color: #2e94ab; text-shadow: #fff 1px 1px 3px; font-family: Georgia; font-weight: bold; font-variant: small-caps; font-size: 30px;"><span style="font-size: 50px;">N</span>ome
<span style="font-size: 50px;">C</span>ognome</span>
<div style="margin-left: 20px;">• Razza:
• Genere:
• Orientamento:
• Data e Luogo di Nascita:
• Fazione d'appartenenza:
• Segno Zodiacale:
• Luogo di Residenza:
• Segno Zodiacale:
• Prima Classe:
• Seconda Classe:
• Grado:
• Energia:
• Soul Points:
• Punti Esperienza:
• Fama/Notorietà: Lettera/Numero
• Descrizione fama:
<div style="overflow: auto; height: 150px; padding: 10px; border-bottom: 2px dashed black;"> blablablablabla Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst. In vehicula augue eros, sed tempus nulla efficitur suscipit. Phasellus lobortis bibendum tortor ac eleifend. Donec massa sapien, cursus sed lacinia sed, tincidunt non ipsum. Duis in ante euismod, semper urna a, varius ligula. Vivamus quis tincidunt arcu. Mauris quis mauris eget urna sagittis suscipit id in metus. Sed non mauris in ipsum ornare iaculis. Quisque vel ligula at risus euismod iaculis eu vitae eros. Donec lacinia leo sed metus consequat, non eleifend nibh vehicula.
Ut non lectus laoreet, dignissim velit sit amet, imperdiet nisl. Mauris suscipit et nulla maximus feugiat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed efficitur lacus sit amet hendrerit mattis. Etiam malesuada in mauris aliquam condimentum. Sed quis odio eros. Nunc eget viverra velit, et cursus erat. Aenean nec sapien tristique, accumsan orci a, vehicula sem. Mauris efficitur leo et turpis congue vulputate.
Nunc quis sodales nisi. Morbi ac tincidunt diam, a convallis justo. Nam tortor sem, eleifend sit amet ultricies vitae, fringilla vitae ante. Donec eu massa a leo volutpat molestie a ac mi. Sed mattis lectus ut elementum lobortis. Fusce interdum, enim vitae viverra iaculis, eros arcu maximus ex, in fermentum nisi dolor scelerisque ex. Nulla vitae velit sit amet lacus tincidunt mollis et ac purus. Etiam volutpat varius justo, in efficitur nunc pharetra nec. Sed vulputate nisi nec ultrices mollis. Donec at commodo dui, at aliquam risus.</div></div>
<table style="border-bottom: 2px dashed black;">
<tr>
<td width="50%"><div style="background-image: linear-gradient(to left, rgba(46,148,171,0), rgba(46,148,171,1)); color: #fff; text-shadow: #fff 0px 0px 1px; font-size: 30px; padding: 5px;">Fisico</div>
<div style="overflow: auto; height: 300px; padding: 10px; margin: 5px; border-right: 2px dashed black;">
• Segni Particolari:
• Vestiario:
blablablablabla Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst. In vehicula augue eros, sed tempus nulla efficitur suscipit. Phasellus lobortis bibendum tortor ac eleifend. Donec massa sapien, cursus sed lacinia sed, tincidunt non ipsum. Duis in ante euismod, semper urna a, varius ligula. Vivamus quis tincidunt arcu. Mauris quis mauris eget urna sagittis suscipit id in metus. Sed non mauris in ipsum ornare iaculis. Quisque vel ligula at risus euismod iaculis eu vitae eros. Donec lacinia leo sed metus consequat, non eleifend nibh vehicula.
Ut non lectus laoreet, dignissim velit sit amet, imperdiet nisl. Mauris suscipit et nulla maximus feugiat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed efficitur lacus sit amet hendrerit mattis. Etiam malesuada in mauris aliquam condimentum. Sed quis odio eros. Nunc eget viverra velit, et cursus erat. Aenean nec sapien tristique, accumsan orci a, vehicula sem. Mauris efficitur leo et turpis congue vulputate.
Nunc quis sodales nisi. Morbi ac tincidunt diam, a convallis justo. Nam tortor sem, eleifend sit amet ultricies vitae, fringilla vitae ante. Donec eu massa a leo volutpat molestie a ac mi. Sed mattis lectus ut elementum lobortis. Fusce interdum, enim vitae viverra iaculis, eros arcu maximus ex, in fermentum nisi dolor scelerisque ex. Nulla vitae velit sit amet lacus tincidunt mollis et ac purus. Etiam volutpat varius justo, in efficitur nunc pharetra nec. Sed vulputate nisi nec ultrices mollis. Donec at commodo dui, at aliquam risus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst. In vehicula augue eros, sed tempus nulla efficitur suscipit. Phasellus lobortis bibendum tortor ac eleifend. Donec massa sapien, cursus sed lacinia sed, tincidunt non ipsum. Duis in ante euismod, semper urna a, varius ligula. Vivamus quis tincidunt arcu. Mauris quis mauris eget urna sagittis suscipit id in metus. Sed non mauris in ipsum ornare iaculis. Quisque vel ligula at risus euismod iaculis eu vitae eros. Donec lacinia leo sed metus consequat, non eleifend nibh vehicula.
Ut non lectus laoreet, dignissim velit sit amet, imperdiet nisl. Mauris suscipit et nulla maximus feugiat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed efficitur lacus sit amet hendrerit mattis. Etiam malesuada in mauris aliquam condimentum. Sed quis odio eros. Nunc eget viverra velit, et cursus erat. Aenean nec sapien tristique, accumsan orci a, vehicula sem. Mauris efficitur leo et turpis congue vulputate.
Nunc quis sodales nisi. Morbi ac tincidunt diam, a convallis justo. Nam tortor sem, eleifend sit amet ultricies vitae, fringilla vitae ante. Donec eu massa a leo volutpat molestie a ac mi. Sed mattis lectus ut elementum lobortis. Fusce interdum, enim vitae viverra iaculis, eros arcu maximus ex, in fermentum nisi dolor scelerisque ex. Nulla vitae velit sit amet lacus tincidunt mollis et ac purus. Etiam volutpat varius justo, in efficitur nunc pharetra nec. Sed vulputate nisi nec ultrices mollis. Donec at commodo dui, at aliquam risus.
</div></td>
<td width="50%"><div style="background-image: linear-gradient(to left, rgba(46,148,171,1), rgba(46,148,171,0)); color: #fff; text-shadow: #fff 0px 0px 1px; font-size: 30px; padding: 5px; text-align: right;">Psiche</div>
<div style="overflow: auto; height: 300px; padding: 10px; margin: 5px;">
• Allineamento:
• Obbiettivi:
• Morale:
• Motto:
• Credo e Fede:
blablablablabla Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst. In vehicula augue eros, sed tempus nulla efficitur suscipit. Phasellus lobortis bibendum tortor ac eleifend. Donec massa sapien, cursus sed lacinia sed, tincidunt non ipsum. Duis in ante euismod, semper urna a, varius ligula. Vivamus quis tincidunt arcu. Mauris quis mauris eget urna sagittis suscipit id in metus. Sed non mauris in ipsum ornare iaculis. Quisque vel ligula at risus euismod iaculis eu vitae eros. Donec lacinia leo sed metus consequat, non eleifend nibh vehicula.
Ut non lectus laoreet, dignissim velit sit amet, imperdiet nisl. Mauris suscipit et nulla maximus feugiat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed efficitur lacus sit amet hendrerit mattis. Etiam malesuada in mauris aliquam condimentum. Sed quis odio eros. Nunc eget viverra velit, et cursus erat. Aenean nec sapien tristique, accumsan orci a, vehicula sem. Mauris efficitur leo et turpis congue vulputate.
Nunc quis sodales nisi. Morbi ac tincidunt diam, a convallis justo. Nam tortor sem, eleifend sit amet ultricies vitae, fringilla vitae ante. Donec eu massa a leo volutpat molestie a ac mi. Sed mattis lectus ut elementum lobortis. Fusce interdum, enim vitae viverra iaculis, eros arcu maximus ex, in fermentum nisi dolor scelerisque ex. Nulla vitae velit sit amet lacus tincidunt mollis et ac purus. Etiam volutpat varius justo, in efficitur nunc pharetra nec. Sed vulputate nisi nec ultrices mollis. Donec at commodo dui, at aliquam risus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst. In vehicula augue eros, sed tempus nulla efficitur suscipit. Phasellus lobortis bibendum tortor ac eleifend. Donec massa sapien, cursus sed lacinia sed, tincidunt non ipsum. Duis in ante euismod, semper urna a, varius ligula. Vivamus quis tincidunt arcu. Mauris quis mauris eget urna sagittis suscipit id in metus. Sed non mauris in ipsum ornare iaculis. Quisque vel ligula at risus euismod iaculis eu vitae eros. Donec lacinia leo sed metus consequat, non eleifend nibh vehicula.
Ut non lectus laoreet, dignissim velit sit amet, imperdiet nisl. Mauris suscipit et nulla maximus feugiat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed efficitur lacus sit amet hendrerit mattis. Etiam malesuada in mauris aliquam condimentum. Sed quis odio eros. Nunc eget viverra velit, et cursus erat. Aenean nec sapien tristique, accumsan orci a, vehicula sem. Mauris efficitur leo et turpis congue vulputate.
Nunc quis sodales nisi. Morbi ac tincidunt diam, a convallis justo. Nam tortor sem, eleifend sit amet ultricies vitae, fringilla vitae ante. Donec eu massa a leo volutpat molestie a ac mi. Sed mattis lectus ut elementum lobortis. Fusce interdum, enim vitae viverra iaculis, eros arcu maximus ex, in fermentum nisi dolor scelerisque ex. Nulla vitae velit sit amet lacus tincidunt mollis et ac purus. Etiam volutpat varius justo, in efficitur nunc pharetra nec. Sed vulputate nisi nec ultrices mollis. Donec at commodo dui, at aliquam risus.
</div></td>
</tr>
</table>
<div style="background-image: linear-gradient(to left, rgba(46,148,171,0), rgba(46,148,171,1), rgba(46,148,171,0)); color: #fff; text-shadow: #fff 0px 0px 1px; font-size: 30px; padding: 5px; text-align: center;">Background</div>
<div style="overflow: auto; height: 450px; padding: 10px;"> blablablablabla lorem ipsum
blablablablabla Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst. In vehicula augue eros, sed tempus nulla efficitur suscipit. Phasellus lobortis bibendum tortor ac eleifend. Donec massa sapien, cursus sed lacinia sed, tincidunt non ipsum. Duis in ante euismod, semper urna a, varius ligula. Vivamus quis tincidunt arcu. Mauris quis mauris eget urna sagittis suscipit id in metus. Sed non mauris in ipsum ornare iaculis. Quisque vel ligula at risus euismod iaculis eu vitae eros. Donec lacinia leo sed metus consequat, non eleifend nibh vehicula.
Ut non lectus laoreet, dignissim velit sit amet, imperdiet nisl. Mauris suscipit et nulla maximus feugiat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed efficitur lacus sit amet hendrerit mattis. Etiam malesuada in mauris aliquam condimentum. Sed quis odio eros. Nunc eget viverra velit, et cursus erat. Aenean nec sapien tristique, accumsan orci a, vehicula sem. Mauris efficitur leo et turpis congue vulputate.
Nunc quis sodales nisi. Morbi ac tincidunt diam, a convallis justo. Nam tortor sem, eleifend sit amet ultricies vitae, fringilla vitae ante. Donec eu massa a leo volutpat molestie a ac mi. Sed mattis lectus ut elementum lobortis. Fusce interdum, enim vitae viverra iaculis, eros arcu maximus ex, in fermentum nisi dolor scelerisque ex. Nulla vitae velit sit amet lacus tincidunt mollis et ac purus. Etiam volutpat varius justo, in efficitur nunc pharetra nec. Sed vulputate nisi nec ultrices mollis. Donec at commodo dui, at aliquam risus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst. In vehicula augue eros, sed tempus nulla efficitur suscipit. Phasellus lobortis bibendum tortor ac eleifend. Donec massa sapien, cursus sed lacinia sed, tincidunt non ipsum. Duis in ante euismod, semper urna a, varius ligula. Vivamus quis tincidunt arcu. Mauris quis mauris eget urna sagittis suscipit id in metus. Sed non mauris in ipsum ornare iaculis. Quisque vel ligula at risus euismod iaculis eu vitae eros. Donec lacinia leo sed metus consequat, non eleifend nibh vehicula.
Ut non lectus laoreet, dignissim velit sit amet, imperdiet nisl. Mauris suscipit et nulla maximus feugiat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed efficitur lacus sit amet hendrerit mattis. Etiam malesuada in mauris aliquam condimentum. Sed quis odio eros. Nunc eget viverra velit, et cursus erat. Aenean nec sapien tristique, accumsan orci a, vehicula sem. Mauris efficitur leo et turpis congue vulputate.
Nunc quis sodales nisi. Morbi ac tincidunt diam, a convallis justo. Nam tortor sem, eleifend sit amet ultricies vitae, fringilla vitae ante. Donec eu massa a leo volutpat molestie a ac mi. Sed mattis lectus ut elementum lobortis. Fusce interdum, enim vitae viverra iaculis, eros arcu maximus ex, in fermentum nisi dolor scelerisque ex. Nulla vitae velit sit amet lacus tincidunt mollis et ac purus. Etiam volutpat varius justo, in efficitur nunc pharetra nec. Sed vulputate nisi nec ultrices mollis. Donec at commodo dui, at aliquam risus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst. In vehicula augue eros, sed tempus nulla efficitur suscipit. Phasellus lobortis bibendum tortor ac eleifend. Donec massa sapien, cursus sed lacinia sed, tincidunt non ipsum. Duis in ante euismod, semper urna a, varius ligula. Vivamus quis tincidunt arcu. Mauris quis mauris eget urna sagittis suscipit id in metus. Sed non mauris in ipsum ornare iaculis. Quisque vel ligula at risus euismod iaculis eu vitae eros. Donec lacinia leo sed metus consequat, non eleifend nibh vehicula.
Ut non lectus laoreet, dignissim velit sit amet, imperdiet nisl. Mauris suscipit et nulla maximus feugiat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed efficitur lacus sit amet hendrerit mattis. Etiam malesuada in mauris aliquam condimentum. Sed quis odio eros. Nunc eget viverra velit, et cursus erat. Aenean nec sapien tristique, accumsan orci a, vehicula sem. Mauris efficitur leo et turpis congue vulputate.
Nunc quis sodales nisi. Morbi ac tincidunt diam, a convallis justo. Nam tortor sem, eleifend sit amet ultricies vitae, fringilla vitae ante. Donec eu massa a leo volutpat molestie a ac mi. Sed mattis lectus ut elementum lobortis. Fusce interdum, enim vitae viverra iaculis, eros arcu maximus ex, in fermentum nisi dolor scelerisque ex. Nulla vitae velit sit amet lacus tincidunt mollis et ac purus. Etiam volutpat varius justo, in efficitur nunc pharetra nec. Sed vulputate nisi nec ultrices mollis. Donec at commodo dui, at aliquam risus.</div></div>
<div align="center"><div style="width: 600px; height: 200px; overflow: hidden; margin-left: 10px; margin-right: 10px; border: 5px solid #000;">[IMG]https://via.placeholder.com/640x360[/IMG]</div>
<div style="background-image: linear-gradient(to left, rgba(255,255,255,0), rgba(255,255,255,1), rgba(255,255,255,1), rgba(255,255,255,1), rgba(255,255,255,0)); color: #2e94ab; text-shadow: #fff 0px 0px 3px; font-size: 30px; line-height: 33px; padding: 5px; text-align: center;">Oppure citazione citazione citazione</div></div>
<div style="width: 650px; background: rgba(255, 255, 255, 0.8); padding: 0px 30px 30px 30px;">
<table>
<tr>
<td></td>
<td style="text-align: center; font-weight: bold;">Totale</td>
<td></td>
<tr>
<td style="padding-right: 10px; text-align: right; font-weight: bold;">Corpo
Mente
Spirito
Velocità
Destrezza</td>
<td style="padding: 10px; border-right: 2px solid black; border-left: 2px solid black; text-align: center;">000
000
000
000
000</td>
<td style="padding: 10px;">000 Razza + 000 Classe + 000 Energia + 000 Abilità + 000 Altro
000 Razza + 000 Classe + 000 Energia + 000 Abilità + 000 Altro
000 Razza + 000 Classe + 000 Energia + 000 Abilità + 000 Altro
000 Razza + 000 Classe + 000 Energia + 000 Abilità + 000 Altro
000 Razza + 000 Classe + 000 Energia + 000 Abilità + 000 Altro</td>
</tr>
<tr>
<td colspan="3" style="text-align: center; font-size: 11px; line-height: 13px;">Corpo: Danni Bassi/Medi/Alti/Critici + x° livello Potere passivo
Mente: Danni Bassi/Medi/Alti/Critici + x° livello Potere passivo
Spirito: Danni Bassi/Medi/Alti/Critici + x° livello Potere passivo</td>
</tr>
</table>
<div align="center"><div style="text-shadow: #fff 0px 0px 3px; color: #2e94ab; font-size: 20px;"> <a href="#a">Conoscenze</a> • <a href="#b">Abilità</a> • <a href="#c">Tecniche</a> • <a href="#d">Equipaggiamento</a></div></div>
<div style="height: 370px; overflow: hidden;"><a id="a"></a><div style="background-image: linear-gradient(to left, rgba(46,148,171,0), rgba(46,148,171,1), rgba(46,148,171,0)); color: #fff; text-shadow: #fff 0px 0px 1px; font-size: 20px; padding: 5px; text-align: center;">Conoscenze</div>
<div style="overflow: auto; height: 300px; padding: 10px;">
<b>Nome Conoscenza Teorica - Lv.?</b>
<u>Effetto:</u> Descrizione Descrizione
Ut non lectus laoreet, dignissim velit sit amet, imperdiet nisl. Mauris suscipit et nulla maximus feugiat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed efficitur lacus sit amet hendrerit mattis. Etiam malesuada in mauris aliquam condimentum. Sed quis odio eros. Nunc eget viverra velit, et cursus erat. Aenean nec sapien tristique, accumsan orci a, vehicula sem. Mauris efficitur leo et turpis congue vulputate.
<b>Nome Ceppo di Conoscenza Pratica - Apprese x/y</b>
<u>Conoscenza Pratica 1:</u>
descrizione descrizione
Nunc quis sodales nisi. Morbi ac tincidunt diam, a convallis justo. Nam tortor sem, eleifend sit amet ultricies vitae, fringilla vitae ante. Donec eu massa a leo volutpat molestie a ac mi. Sed mattis lectus ut elementum lobortis. Fusce interdum, enim vitae viverra iaculis, eros arcu maximus ex, in fermentum nisi dolor scelerisque ex. Nulla vitae velit sit amet lacus tincidunt mollis et ac purus. Etiam volutpat varius justo, in efficitur nunc pharetra nec. Sed vulputate nisi nec ultrices mollis. Donec at commodo dui, at aliquam risus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst. In vehicula augue eros, sed tempus nulla efficitur suscipit. Phasellus lobortis bibendum tortor ac eleifend. Donec massa sapien, cursus sed lacinia sed, tincidunt non ipsum. Duis in ante euismod, semper urna a, varius ligula. Vivamus quis tincidunt arcu. Mauris quis mauris eget urna sagittis suscipit id in metus. Sed non mauris in ipsum ornare iaculis. Quisque vel ligula at risus euismod iaculis eu vitae eros. Donec lacinia leo sed metus consequat, non eleifend nibh vehicula.</div>
<a id="b"></a><div style="background-image: linear-gradient(to left, rgba(46,148,171,0), rgba(46,148,171,1), rgba(46,148,171,0)); color: #fff; text-shadow: #fff 0px 0px 1px; font-size: 20px; padding: 5px; text-align: center;">Abilità</div>
<div style="overflow: auto; height: 300px; padding: 10px;">
<b>Nome dell'Abilità</b>
Descrizione Descrizione Descrizione Descrizione Descrizione Descrizione
<u>Tipo di Abilità:</u> Matrice, Percezione, ecc
Ut non lectus laoreet, dignissim velit sit amet, imperdiet nisl. Mauris suscipit et nulla maximus feugiat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed efficitur lacus sit amet hendrerit mattis. Etiam malesuada in mauris aliquam condimentum. Sed quis odio eros. Nunc eget viverra velit, et cursus erat. Aenean nec sapien tristique, accumsan orci a, vehicula sem. Mauris efficitur leo et turpis congue vulputate.
Nunc quis sodales nisi. Morbi ac tincidunt diam, a convallis justo. Nam tortor sem, eleifend sit amet ultricies vitae, fringilla vitae ante. Donec eu massa a leo volutpat molestie a ac mi. Sed mattis lectus ut elementum lobortis. Fusce interdum, enim vitae viverra iaculis, eros arcu maximus ex, in fermentum nisi dolor scelerisque ex. Nulla vitae velit sit amet lacus tincidunt mollis et ac purus. Etiam volutpat varius justo, in efficitur nunc pharetra nec. Sed vulputate nisi nec ultrices mollis. Donec at commodo dui, at aliquam risus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst. In vehicula augue eros, sed tempus nulla efficitur suscipit. Phasellus lobortis bibendum tortor ac eleifend. Donec massa sapien, cursus sed lacinia sed, tincidunt non ipsum. Duis in ante euismod, semper urna a, varius ligula. Vivamus quis tincidunt arcu. Mauris quis mauris eget urna sagittis suscipit id in metus. Sed non mauris in ipsum ornare iaculis. Quisque vel ligula at risus euismod iaculis eu vitae eros. Donec lacinia leo sed metus consequat, non eleifend nibh vehicula.</div>
<a id="c"></a><div style="background-image: linear-gradient(to left, rgba(46,148,171,0), rgba(46,148,171,1), rgba(46,148,171,0)); color: #fff; text-shadow: #fff 0px 0px 1px; font-size: 20px; padding: 5px; text-align: center;">Tecniche</div>
<div style="overflow: auto; height: 300px; padding: 10px;">
<b>Nome della Tecnica</b>
<i>Tipo di tecnica</i>
Descrizione Descrizione Descrizione Descrizione Descrizione Descrizione
<u>Raggio:</u>
<b>Consumo:</b>
<b>Matrice:</b>
Ut non lectus laoreet, dignissim velit sit amet, imperdiet nisl. Mauris suscipit et nulla maximus feugiat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed efficitur lacus sit amet hendrerit mattis. Etiam malesuada in mauris aliquam condimentum. Sed quis odio eros. Nunc eget viverra velit, et cursus erat. Aenean nec sapien tristique, accumsan orci a, vehicula sem. Mauris efficitur leo et turpis congue vulputate.
Nunc quis sodales nisi. Morbi ac tincidunt diam, a convallis justo. Nam tortor sem, eleifend sit amet ultricies vitae, fringilla vitae ante. Donec eu massa a leo volutpat molestie a ac mi. Sed mattis lectus ut elementum lobortis. Fusce interdum, enim vitae viverra iaculis, eros arcu maximus ex, in fermentum nisi dolor scelerisque ex. Nulla vitae velit sit amet lacus tincidunt mollis et ac purus. Etiam volutpat varius justo, in efficitur nunc pharetra nec. Sed vulputate nisi nec ultrices mollis. Donec at commodo dui, at aliquam risus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst. In vehicula augue eros, sed tempus nulla efficitur suscipit. Phasellus lobortis bibendum tortor ac eleifend. Donec massa sapien, cursus sed lacinia sed, tincidunt non ipsum. Duis in ante euismod, semper urna a, varius ligula. Vivamus quis tincidunt arcu. Mauris quis mauris eget urna sagittis suscipit id in metus. Sed non mauris in ipsum ornare iaculis. Quisque vel ligula at risus euismod iaculis eu vitae eros. Donec lacinia leo sed metus consequat, non eleifend nibh vehicula.</div>
<a id="d"></a><div style="background-image: linear-gradient(to left, rgba(46,148,171,0), rgba(46,148,171,1), rgba(46,148,171,0)); color: #fff; text-shadow: #fff 0px 0px 1px; font-size: 20px; padding: 5px; text-align: center;">Equipaggiamento</div>
<div style="overflow: auto; height: 300px; padding: 10px;">
<b>Nome Oggetto</b>
<i>Tipo di equipaggiamento</i>
<u>Rarità</u>
Descrizione Descrizione Descrizione Descrizione Descrizione Descrizione
<b>Effetti:</b>
<b>Ingombro:</b>
<u>Costo:</u>
Ut non lectus laoreet, dignissim velit sit amet, imperdiet nisl. Mauris suscipit et nulla maximus feugiat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed efficitur lacus sit amet hendrerit mattis. Etiam malesuada in mauris aliquam condimentum. Sed quis odio eros. Nunc eget viverra velit, et cursus erat. Aenean nec sapien tristique, accumsan orci a, vehicula sem. Mauris efficitur leo et turpis congue vulputate.
Nunc quis sodales nisi. Morbi ac tincidunt diam, a convallis justo. Nam tortor sem, eleifend sit amet ultricies vitae, fringilla vitae ante. Donec eu massa a leo volutpat molestie a ac mi. Sed mattis lectus ut elementum lobortis. Fusce interdum, enim vitae viverra iaculis, eros arcu maximus ex, in fermentum nisi dolor scelerisque ex. Nulla vitae velit sit amet lacus tincidunt mollis et ac purus. Etiam volutpat varius justo, in efficitur nunc pharetra nec. Sed vulputate nisi nec ultrices mollis. Donec at commodo dui, at aliquam risus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst. In vehicula augue eros, sed tempus nulla efficitur suscipit. Phasellus lobortis bibendum tortor ac eleifend. Donec massa sapien, cursus sed lacinia sed, tincidunt non ipsum. Duis in ante euismod, semper urna a, varius ligula. Vivamus quis tincidunt arcu. Mauris quis mauris eget urna sagittis suscipit id in metus. Sed non mauris in ipsum ornare iaculis. Quisque vel ligula at risus euismod iaculis eu vitae eros. Donec lacinia leo sed metus consequat, non eleifend nibh vehicula.</div></div></div>
<div align="center"><div style="width: 600px; height: 200px; overflow: hidden; margin-left: 10px; margin-right: 10px; border: 5px solid #000;">[IMG]https://via.placeholder.com/640x360[/IMG]</div>
<div style="background-image: linear-gradient(to left, rgba(255,255,255,0), rgba(255,255,255,1), rgba(255,255,255,1), rgba(255,255,255,1), rgba(255,255,255,0)); color: #2e94ab; text-shadow: #fff 0px 0px 3px; font-size: 30px; line-height: 33px; padding: 5px; text-align: center;">Oppure citazione citazione citazione</div></div>
<div style="width: 650px; background: rgba(255, 255, 255, 0.8); padding: 0px 30px 30px 30px;">
<div style="float: right; width: 200px; height: 200px; overflow: hidden; margin-left: 10px; margin-right: 10px; border: 5px solid #2e94ab;">[IMG]https://cdn.shopify.com/s/files/1/0533/2089/files/placeholder-images-image_large.png?format=jpg&quality=90&v=1530129081[/IMG]</div>
<span style="color: #2e94ab; text-shadow: #fff 1px 1px 3px; font-family: Georgia; font-weight: bold; font-variant: small-caps; font-size: 20px;"><span style="font-size: 30px;">N</span>ome creaturo</span>
<div style="margin-left: 20px;">• Specie:
• Genere:
• Tipo:
• Dimensioni:
<ul>- Altezza al garrese:
- Altezza terra/testa:
- Lunghezza: (coda esclusa)
- Coda:
- Peso:</ul>
• Cavalcabile: Ś/No
• Ceppo Classe d'Appartenenza:
• Energia:
• Soul Points:
• Punti Esperienza:</div>
<div style="background-image: linear-gradient(to left, rgba(46,148,171,0), rgba(46,148,171,1), rgba(46,148,171,0)); color: #fff; text-shadow: #fff 0px 0px 1px; font-size: 20px; padding: 5px; text-align: center;">Fisico e Psiche</div>
<div style="overflow: auto; height: 200px; padding: 10px;">• Fisico:
Ut non lectus laoreet, dignissim velit sit amet, imperdiet nisl. Mauris suscipit et nulla maximus feugiat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed efficitur lacus sit amet hendrerit mattis. Etiam malesuada in mauris aliquam condimentum. Sed quis odio eros. Nunc eget viverra velit, et cursus erat. Aenean nec sapien tristique, accumsan orci a, vehicula sem. Mauris efficitur leo et turpis congue vulputate.
Nunc quis sodales nisi. Morbi ac tincidunt diam, a convallis justo. Nam tortor sem, eleifend sit amet ultricies vitae, fringilla vitae ante. Donec eu massa a leo volutpat molestie a ac mi. Sed mattis lectus ut elementum lobortis. Fusce interdum, enim vitae viverra iaculis, eros arcu maximus ex, in fermentum nisi dolor scelerisque ex. Nulla vitae velit sit amet lacus tincidunt mollis et ac purus. Etiam volutpat varius justo, in efficitur nunc pharetra nec. Sed vulputate nisi nec ultrices mollis. Donec at commodo dui, at aliquam risus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst. In vehicula augue eros, sed tempus nulla efficitur suscipit. Phasellus lobortis bibendum tortor ac eleifend. Donec massa sapien, cursus sed lacinia sed, tincidunt non ipsum. Duis in ante euismod, semper urna a, varius ligula. Vivamus quis tincidunt arcu. Mauris quis mauris eget urna sagittis suscipit id in metus. Sed non mauris in ipsum ornare iaculis. Quisque vel ligula at risus euismod iaculis eu vitae eros. Donec lacinia leo sed metus consequat, non eleifend nibh vehicula.Ut non lectus laoreet, dignissim velit sit amet, imperdiet nisl. Mauris suscipit et nulla maximus feugiat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed efficitur lacus sit amet hendrerit mattis. Etiam malesuada in mauris aliquam condimentum. Sed quis odio eros. Nunc eget viverra velit, et cursus erat. Aenean nec sapien tristique, accumsan orci a, vehicula sem. Mauris efficitur leo et turpis congue vulputate.
• Psiche:
Nunc quis sodales nisi. Morbi ac tincidunt diam, a convallis justo. Nam tortor sem, eleifend sit amet ultricies vitae, fringilla vitae ante. Donec eu massa a leo volutpat molestie a ac mi. Sed mattis lectus ut elementum lobortis. Fusce interdum, enim vitae viverra iaculis, eros arcu maximus ex, in fermentum nisi dolor scelerisque ex. Nulla vitae velit sit amet lacus tincidunt mollis et ac purus. Etiam volutpat varius justo, in efficitur nunc pharetra nec. Sed vulputate nisi nec ultrices mollis. Donec at commodo dui, at aliquam risus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst. In vehicula augue eros, sed tempus nulla efficitur suscipit. Phasellus lobortis bibendum tortor ac eleifend. Donec massa sapien, cursus sed lacinia sed, tincidunt non ipsum. Duis in ante euismod, semper urna a, varius ligula. Vivamus quis tincidunt arcu. Mauris quis mauris eget urna sagittis suscipit id in metus. Sed non mauris in ipsum ornare iaculis. Quisque vel ligula at risus euismod iaculis eu vitae eros. Donec lacinia leo sed metus consequat, non eleifend nibh vehicula.
</div>
<table>
<tr>
<td></td>
<td style="text-align: center; font-weight: bold;">Totale</td>
<td></td>
<tr>
<td style="padding-right: 10px; text-align: right; font-weight: bold;">Corpo
Mente
Spirito
Velocità
Destrezza</td>
<td style="padding: 10px; border-right: 2px solid black; border-left: 2px solid black; text-align: center;">000
000
000
000
000</td>
<td style="padding: 10px;">000 Razza + 000 Classe + 000 Energia + 000 Abilità + 000 Altro
000 Razza + 000 Classe + 000 Energia + 000 Abilità + 000 Altro
000 Razza + 000 Classe + 000 Energia + 000 Abilità + 000 Altro
000 Razza + 000 Classe + 000 Energia + 000 Abilità + 000 Altro
000 Razza + 000 Classe + 000 Energia + 000 Abilità + 000 Altro</td>
</tr>
<tr>
<td colspan="3" style="text-align: center; font-size: 11px; line-height: 13px;">Corpo: Danni Bassi/Medi/Alti/Critici + x° livello Potere passivo
Mente: Danni Bassi/Medi/Alti/Critici + x° livello Potere passivo
Spirito: Danni Bassi/Medi/Alti/Critici + x° livello Potere passivo</td>
</tr>
</table>
<div style="background-image: linear-gradient(to left, rgba(46,148,171,0), rgba(46,148,171,1), rgba(46,148,171,0)); color: #fff; text-shadow: #fff 0px 0px 1px; font-size: 20px; padding: 5px; text-align: center;">Abilità • Tecniche • Comandi</div>
<div style="overflow: auto; height: 200px; padding: 10px;"><b>Nome dell'Abilità</b>
Descrizione Descrizione Descrizione Descrizione Descrizione Descrizione
<u>Tipo di Abilità:</u> Matrice, Percezione, ecc
Ut non lectus laoreet, dignissim velit sit amet, imperdiet nisl. Mauris suscipit et nulla maximus feugiat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed efficitur lacus sit amet hendrerit mattis. Etiam malesuada in mauris aliquam condimentum. Sed quis odio eros. Nunc eget viverra velit, et cursus erat. Aenean nec sapien tristique, accumsan orci a, vehicula sem. Mauris efficitur leo et turpis congue vulputate.
<b>Nome della Tecnica</b>
<i>Tipo di tecnica</i>
Descrizione Descrizione Descrizione Descrizione Descrizione Descrizione
<u>Raggio:</u>
<b>Consumo:</b>
<b>Matrice:</b>
Nunc quis sodales nisi. Morbi ac tincidunt diam, a convallis justo. Nam tortor sem, eleifend sit amet ultricies vitae, fringilla vitae ante. Donec eu massa a leo volutpat molestie a ac mi. Sed mattis lectus ut elementum lobortis. Fusce interdum, enim vitae viverra iaculis, eros arcu maximus ex, in fermentum nisi dolor scelerisque ex. Nulla vitae velit sit amet lacus tincidunt mollis et ac purus. Etiam volutpat varius justo, in efficitur nunc pharetra nec. Sed vulputate nisi nec ultrices mollis. Donec at commodo dui, at aliquam risus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst. In vehicula augue eros, sed tempus nulla efficitur suscipit. Phasellus lobortis bibendum tortor ac eleifend. Donec massa sapien, cursus sed lacinia sed, tincidunt non ipsum. Duis in ante euismod, semper urna a, varius ligula. Vivamus quis tincidunt arcu. Mauris quis mauris eget urna sagittis suscipit id in metus. Sed non mauris in ipsum ornare iaculis. Quisque vel ligula at risus euismod iaculis eu vitae eros. Donec lacinia leo sed metus consequat, non eleifend nibh vehicula.Ut non lectus laoreet, dignissim velit sit amet, imperdiet nisl. Mauris suscipit et nulla maximus feugiat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed efficitur lacus sit amet hendrerit mattis. Etiam malesuada in mauris aliquam condimentum. Sed quis odio eros. Nunc eget viverra velit, et cursus erat. Aenean nec sapien tristique, accumsan orci a, vehicula sem. Mauris efficitur leo et turpis congue vulputate.
Nunc quis sodales nisi. Morbi ac tincidunt diam, a convallis justo. Nam tortor sem, eleifend sit amet ultricies vitae, fringilla vitae ante. Donec eu massa a leo volutpat molestie a ac mi. Sed mattis lectus ut elementum lobortis. Fusce interdum, enim vitae viverra iaculis, eros arcu maximus ex, in fermentum nisi dolor scelerisque ex. Nulla vitae velit sit amet lacus tincidunt mollis et ac purus. Etiam volutpat varius justo, in efficitur nunc pharetra nec. Sed vulputate nisi nec ultrices mollis. Donec at commodo dui, at aliquam risus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst. In vehicula augue eros, sed tempus nulla efficitur suscipit. Phasellus lobortis bibendum tortor ac eleifend. Donec massa sapien, cursus sed lacinia sed, tincidunt non ipsum. Duis in ante euismod, semper urna a, varius ligula. Vivamus quis tincidunt arcu. Mauris quis mauris eget urna sagittis suscipit id in metus. Sed non mauris in ipsum ornare iaculis. Quisque vel ligula at risus euismod iaculis eu vitae eros. Donec lacinia leo sed metus consequat, non eleifend nibh vehicula.
</div>
</div>
<div style="padding: 10px; border-top: 3px solid #000; border-bottom: 3px solid #000; width: 300px; font-size: 11px; line-height: 14px; background: rgba(255, 255, 255, 0.8); font-family: consolas; text-align: center;"><b>Nome prestavolto e link:</b> Nome e immagine
<b>Fonte prestavolto:</b> Opera/Libro
[URL=https://entropiagdr.forumfree.it/](c) Entropia GDR.[/URL] Modifica e utilizzo consentiti, peṛ lasciatecelo un link dai.</div>
</div>
CRONOLOGIACronologiaArchivioNome e link role
Tipo di role
Sinossi breve degli avvenimenti. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst. In vehicula augue eros, sed tempus nulla efficitur suscipit. Phasellus lobortis bibendum tortor ac eleifend.
{ X Guil - Y EXP - Z Fama - A Notorietà}
Nome e link role
Tipo di role
Sinossi breve degli avvenimenti. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst.
{ X Guil - Y EXP - Z Fama - A Notorietà}
Nome e link role
Tipo di role
Sinossi breve degli avvenimenti. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula.
{ X Guil - Y EXP - Z Fama - A Notorietà}
Nome e link role
Tipo di role
Sinossi breve degli avvenimenti. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst.
{ X Guil - Y EXP - Z Fama - A Notorietà}Legami
Nome pg
Tipo di legame
Breve descrizione di come lo ha incontrato (magari link) e rapporto che hanno. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst.
Nome pg
Tipo di legame
Breve descrizione di come lo ha incontrato (magari link) e rapporto che hanno. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst.
Nome pg
Tipo di legame
Breve descrizione di come lo ha incontrato (magari link) e rapporto che hanno. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst.Registro
GG/MM/AAA: Salgo di energia a gialla. Inserite nuove tecniche ed abilità (nome1, nome2, nome3), acquistati x y e z (ecc ecc)
GG/MM/AAA: Guadagno x punti exp per addestramento (link). totale y punti exp.
GG/MM/AAA: Scheda Accettata, acquisti iniziali x(tot guil) e y(tot guil) per una spesa di z(x+y guil). Rimanenti TOT Guil.
GG/MM/AAA: Scheda creata.(c) Entropia GDR. Modifica e utilizzo consentiti, peṛ lasciatecelo un link dai.SPOILER (clicca per visualizzare)HTML<div style="width: 800px; font-family: cambria; color: #000; font-size: 14px; line-height: 16px; background-image: url(https://upload.forumfree.net/i/fc9161612/pattern_prova_2.png); border-top: 15px solid black; border-bottom: 15px solid black;">
<div style="width: 650px; background: rgba(255, 255, 255, 0.8); padding: 0px 30px 30px 30px;">
<div style="color: #2e94ab; text-shadow: #fff 1px 1px 3px; font-family: Georgia; font-weight: bold; font-variant: small-caps; font-size: 30px; padding-top: 20px;"><span style="font-size: 50px;">C</span>ronologia</div>
<div style="background-image: linear-gradient(to left, rgba(46,148,171,0), rgba(46,148,171,1)); color: #fff; text-shadow: #fff 0px 0px 1px; font-size: 30px; padding: 5px;">Archivio</div>
<div style="overflow: auto; height: 250px; padding: 10px;"><b>Nome e link role</b>
<i>Tipo di role</i>
Sinossi breve degli avvenimenti. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst. In vehicula augue eros, sed tempus nulla efficitur suscipit. Phasellus lobortis bibendum tortor ac eleifend.
{ X Guil - Y EXP - Z Fama - A Notorietà}
<b>Nome e link role</b>
<i>Tipo di role</i>
Sinossi breve degli avvenimenti. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst.
{ X Guil - Y EXP - Z Fama - A Notorietà}
<b>Nome e link role</b>
<i>Tipo di role</i>
Sinossi breve degli avvenimenti. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula.
{ X Guil - Y EXP - Z Fama - A Notorietà}
<b>Nome e link role</b>
<i>Tipo di role</i>
Sinossi breve degli avvenimenti. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst.
{ X Guil - Y EXP - Z Fama - A Notorietà}
</div>
<div style="background-image: linear-gradient(to left, rgba(46,148,171,0), rgba(46,148,171,1), rgba(46,148,171,0)); color: #fff; text-shadow: #fff 0px 0px 1px; font-size: 30px; padding: 5px; text-align: center;">Legami</div>
<div style="overflow: auto; height: 250px; padding: 10px;">
<b>Nome pg</b>
<i>Tipo di legame</i>
Breve descrizione di come lo ha incontrato (magari link) e rapporto che hanno. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst.
<b>Nome pg</b>
<i>Tipo di legame</i>
Breve descrizione di come lo ha incontrato (magari link) e rapporto che hanno. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst.
<b>Nome pg</b>
<i>Tipo di legame</i>
Breve descrizione di come lo ha incontrato (magari link) e rapporto che hanno. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus elit velit, gravida bibendum metus mollis eu. Cras ultricies ultricies enim eu vestibulum. Duis ac orci massa. Duis finibus suscipit vehicula. In hac habitasse platea dictumst.</div>
<div style="background-image: linear-gradient(to left, rgba(46,148,171,1), rgba(46,148,171,0)); color: #fff; text-shadow: #fff 0px 0px 1px; font-size: 30px; padding: 5px; text-align: right;">Registro</div>
<div style="overflow: auto; height: 250px; padding: 10px;">
GG/MM/AAA: Salgo di energia a gialla. Inserite nuove tecniche ed abilità (nome1, nome2, nome3), acquistati x y e z (ecc ecc)
GG/MM/AAA: Guadagno x punti exp per addestramento (link). totale y punti exp.
GG/MM/AAA: Scheda Accettata, acquisti iniziali x(tot guil) e y(tot guil) per una spesa di z(x+y guil). Rimanenti TOT Guil.
GG/MM/AAA: Scheda creata.</div>
</div>
<div style="padding: 10px; border-top: 3px solid #000; border-bottom: 3px solid #000; width: 200px; font-size: 11px; line-height: 14px; background: rgba(255, 255, 255, 0.8); font-family: consolas; text-align: center;">[URL=https://entropiagdr.forumfree.it/](c) Entropia GDR.[/URL] Modifica e utilizzo consentiti, peṛ lasciatecelo un link dai.</div>
</div>
Edited by senzanome. - 18/11/2020, 22:52. -
.
No one should ask you for the name of the one who tells the story
- Group
- Admin
- Posts
- 16,278
- Status
- Anonymous
Contatore barra
Per rappresentare exp in corso, mana in esaurimento, o qualsiasi altro tipo di contatore vogliate
L'unica cosa che avete bisogno è fare una proporzione per capire a quanto % dovete impostare il div interno. Per farlo vi basta fare una proporzione con i dati che volete rappresentare, e se non sapete come si fa, vi metto un esempio in spoiler.SPOILER (clicca per visualizzare)Facciamo un esempio con gli SP. Siete a bianca e vi rimangono 125 SP su 300 e usate il contatore per visualizzare quanto mana avete.
300 sp sono il massimo, cioé 100%, quindi la proporzione è: 125:300=x:100
Da qui moltiplicate 125 per 100 e poi lo dividete per 300. Viene 41,6 periodico, arrotondiamo a 41 o 42 e voilà.125/300
Codice utilizzato:HTML<div style="background: #444; border: 5px solid #222; width: 300px; height: 18px;"><div style="height: 0%; width: 100%; color: white; font-weight: bold; valign: center;" align="center">75/300</div><div style="width: 25%; background: firebrick; float: left; height: 100%;"></div></div>
Codice pulito:HTML<div style="background: #COLORESFONDO; border: SPESSOREBORDOpx solid #COLOREBORDO; width: LARGHEZZATOTALEpx; height: ALTEZZATOTALEpx;"><div style="height: 0%; width: 100%; color: #COLOREFONT; font-weight: bold; valign: center;" align="center">TESTO/TESTO</div><div style="width: GRANDEZZA BARRA%; background: #COLORE BARRA; float: left; height: 100%;"></div></div>. -
.
No one should ask you for the name of the one who tells the story
- Group
- Admin
- Posts
- 16,278
- Status
- Anonymous
Contatore barra contrapposto
Per contare valori appunto contrapposti: magari per contare amicizia vs inimicizia.
Valgono le stesse regole del codice precedente
125/300HTML<div style="background: #444; border: 5px solid #222; width: 300px; height: 18px;"><div style="height: 0%; width: 100%; color: white; font-weight: bold; valign: center;" align="center">125/300</div><div style="height: 100%; width: 50%; float: left;"><div style="width: 41%; background: orange; float: right; height: 100%;" align="center"></div></div><div style="height: 100%; width: 50%; float: right;"><div style="width: 21%; background: firebrick; float: left; height: 100%;" align="center"></div></div></div>
Codice pulito:HTML<div style="background: #COLORESFONDO; border: SPESSOREBORDOpx solid #COLOREBORDO; width: LARGHEZZATOTALEpx; height: ALTEZZATOTALEpx;"><div style="height: 0%; width: 100%; color: #COLOREFONT; font-weight: bold; valign: center;" align="center">TESTO</div><div style="height: 100%; width: 50%; float: left;"><div style="width: GRANDEZZA BARRA%; background: #COLORE BARRA; float: right; height: 100%;" align="center"></div></div><div style="height: 100%; width: 50%; float: right;"><div style="width: GRANDEZZA BARRA%; background: #COLORE BARRA; float: left; height: 100%;" align="center"></div></div></div>.
Catalogo libero codici HTML |
