Come Creare una Skyn

« Older Newer »

Peppe-73

Posted on 17/5/2010, 15:32 by: Peppe-73

Disse un saggio: Gli amici sono come l'ombrello.... quando ti serve non lo ai mai.

Group: Founder

Posts: 4,144

Reputation: +1

Location: Non rispondo agli MP X richieste di supporto è consigli, " USATE IL MIO FORUM " e fatto apposta.

Status

Vi metto a disposizione un CSS di base " ossia quello che trovate in Colori e Stili " da questo CSS di partenza che dovrete personalizzare in base alle vostre idee potrete iniziare a provarea a fare la vostra skyn, questo CSS una particolarità ha le descrizioni nei vari campi che dice a cosa si riferisce il codice.
Questo codice e realizzato dallo Skynner Exile84 trovate i crediti in fondo a questo forum.

CODICE

/* -------------------LOGO E SFONDO PRINCIPALE-------------------- */
/* SFONDO DEL LOGO PRINCIPALE */
.header {background-image: none; background-color: none}
/* ------ F I N E ------ */
/* POSZIONE DELLO SFONDO GENERALE(static, scroll) */
body {background-attachment: static}
/* ------ F I N E ------ */

/* --------------------------MENU UTENTE-------------------------- */
/* SFONDO DEL MENU' */
.menu {background-color: none}
.menu {background-image: url(http://....)}
/* DIMENSIONE DEL MENU' */
.menu {width: 800px; height: 40px}
/* SCRITTA "BENVENUTO" */
.menu {text-align: center; font-style: italic; text-decoration: none; font-weight: bold; font-size: 11px; font-family: segoe ui; color: #......}
/* LINK AL NOME UTENTE, MESSAGGI & OPZIONI */
.menu a:link, .menu a:visited {font-style: normal; font-weight: bold; font-size: 10px; font-family: segoe ui; text-decoration: none; color: #......}
.menu a:hover {font-style: normal; font-weight: bold; font-size: 10px; font-family: segoe ui; text-decoration: underline; color: #.......}
/* CASELLA DI RICERCA */
.menu .textinput {font-style: italic; font-weight: bold; font-size: 10px; font-family: segoe ui; text-decoration: none; color: black}
.menu .forminput {background-image: url(http://......); background-color: none; height: 23px; whidth: 55px}
/* MENU' UTENTI & GUIDA */
.menu_right {display:none} oppure .menu_right {text-align: center; font-style: italic; text-decoration: none; font-weight: bold; font-size: 11px; font-family: segoe ui; color: #......}
/* ------ F I N E ------ */

/* ---------------------MENU' DI NAVIGAZIONE---------------------- */
/* SCRITTA "AMMINISTRAZIONE" */
.nav a:link, .nav a:visited {text-align: left; font-style: normal; text-decoration: none; font-weight: none; font-size: 13px; font-family: segoe ui; color: #......}
.nav a:hover {text-align: left; font-style: normal; text-decoration: underline; font-weight: none; font-size: 13px; font-family: segoe ui; color: #......}
/* SCRITTE NAVIGAZIONE SEZIONI */
.nav {text-align: left; font-style: italic; text-decoration: none; font-weight: none; font-size: 13px; font-family: segoe ui; color: white}
.nav: hover {text-align: left; font-style: italic; text-decoration: underline; font-weight: none; font-size: 13px; font-family: segoe ui; color: #......}
/* SCRITTA "BENTORNATO, LA TUA ULTIMA VISITA..." */
.navsub {text-align: none; font-style: none; text-decoration: none; font-weight: none; font-size: 12px; font-family: segoe ui; color: #......}
/* LINK PRESENTI ALLA DESTRA DI "BENTORNATO..." */
.navsub a:link {text-align: none; font-style: none; text-decoration: underline; font-weight: none; font-size: 12px; font-family: segoe ui; color: #.......}
.navsub a:hover {text-align: none; font-style: none; text-decoration: underline; font-weight: none; font-size: 14px; font-family: segoe ui; color: #......}
/* ------ F I N E ------ */

/* -----------------LARGHEZZA COMPLESSIVA DEL FORUM--------------- */
/* CORPO DEL FORUM */
.skin_tbl {width: 80%}
/* STATISTICHE E SCRITTE ESTERNE */
.skin_tbl_width, .header_width, .stats .border {width: 78%}

/* -------------------------TAG BOARD---------------------------- */
/* LARGHEZZA DELLA TAGBOARD */
.tag .skin_tbl {width: 80%}
/* TITOLO DELLA TAGBOARD */
.tag .mtitle {color: #......; font-style: none; font-weight: bold; font-size: 16px; text-align: center; padding-left: 30px; font-family: segoe ui}
/* IMMAGINE-COLORE DI SFONDO PREDEFINITO */
.tag .mainbg {background-color: #........}
/* DIVISORE FRA VARIE RISPOSTE IN TAG */
.tag .aa, .tag .ww {border-bottom: 0 dotted black}
/* SCRITTE DELLA TAGBOARD */
.tag .aa {color: #.....; font-style: none; font-weight: none; font-family: segoe ui; font-size: 11px}
.tag .ww {color: #.......; font-style: none; font-weight: none; font-family: segoe ui; font-size: 11px}
/* LINK UTENTI IN TAGBOARD */
.tag .aa, .ww a:link, .tag .aa, .ww a:visited {color: #......; font-style: none; font-weight: none; font-family: segoe ui; font-size: 11px}
.tag .aa a:hover {color: #.....; font-style: none; font-weight: none; text-decoration: underline; font-family: segoe ui; font-size: 11px}
.tag .ww a:hover {color: #......; font-style: none; font-weight: none; text-decoration: underline; font-family: segoe ui; font-size: 11px}
/* PULSANTI DELLA TAGBOARD */
.tag .codebuttons {color: #.....; font-style: none; font-weight: none; font-family: segoe ui; font-size: 11px}
/* CASELLA DI TESTO IN TAGBOARD */
.tag .textinput {color: #........; font-style: italic; font-weight: none; font-family: segoe ui; font-size: 11px; width: 300px; height: 50px}
/* SFONDO DELLE RISPOSTE IN TAG LINEA .AA*/
.tag .aa {background-color: #.......}
/* ------ F I N E ------ */

/* -----------------CORNICE ATTORNO AL FORUM------------------- */
/* SCRITTE DEL BORDO SUPERIORE */
.mtitle {text-align: center; letter-spacing: 1px; word-spacing: 2px; margin-top: 30px; font-weight: bold; font-size: 12pt; font-family: segoe ui; color: #......; width: 90%}
/* BORDO SUPERIORE */
.mback {height: 70px; whidth: auto; background-image: url(http://......); background-repeat: repeat-x}
/* ANGOLO SUPERIORE SINISTRO */
.mleft_top {height: 70px; width: 40px; background-image: url(http://.......); background-repeat: no-repeat}
/* ANGOLO SUPERIORE DESTRO */
.mright_top {height: 70px; width: 40px; background-image: url(http://......); background-repeat: no-repeat}
/* BORDO DI SINISTRA */
.mleft {height: auto; width: 40px; background-image: url(http://.......); background-repeat: repeat-y}
/* ANGOLO INFERIORE SINISTRO */
.mleft_bottom {height: 40px; width: 40px; background-image: url(http://.....); background-repeat: no-repeat}
/* BORDO DI DESTRA */
.mright {height: auto; width: 40px; background-image: url(http://........); background-repeat: repeat-y}
/* ANGOLO INFERIORE DESTRO */
.mright_bottom {height: 40px; width: 40px; background-image: url(http://......); background-repeat: no-repeat}
/* BORDO INFERIORE */
.msub {height: 70px; whidth: auto; background-image: url(http://.......); background-repeat: repeat-x}
/* SFONDO GENERALE DI TUTTO IL FORUM */
.mainbg {background-color: #.....; background-repeat: repeat-x-y}
/* PULSANTI DI APERTURA/CHIUSURA -PLUS/MINUS */
.minus, .plus {border: 0 solid #888; width: 95px; height: 25px; margin-top: 30px}
.plus {background-image: url(http://.....)}
.minus {background-image: url(http://......)}
/* LOGO DESTRO PRESENTE SULLA CORNICE */
.mback_right {width: 20px; background: url(http://.....) no-repeat center right; height: 22px}
/* LOGO SINISTRO DA INSERIRE SULLA CORNICE */
.mback_left {width: 140px; height: 20px; margin-top: 60px; background: url(http://.....) no-repeat left bottom}
/* ------ F I N E ------ */

/*-----------------------------------------------------------------*/
/* ---------------IMPOSTAZIONI CONTENUTI DEL FORUM---------------- */
/* ----------------------CONTENUTI DEL FORUM---------------------- */
/* SFONDO SCRITTE SOPRA LA CORNICE */
.mtitle {background-image: none; background-color: none}
/* BARRA DEI TITOLI E SOTTOBARRA(Disc. Succ-Prec/ N° risp dal..*/
.title, .foot {font-weight: bold; font-family: segoe ui; font-size: 10px; color: black}
/* SFONDO BARRA DEI TITOLI(Disc. Secc-Prec)*/
.title {background-image: url(http://.....); repeat: repeat-x; background-color: none}
/* SFONDO SOTTOBARRA HOME PAGE */
.board .foot {background-image: url(http://.....); repeat: repeat-x; background-color: none}
/* SFONDO SOTTOBARRA(N° risp dal...) */
.foot {background-image: url(http://.....); repeat: repeat-x; background-color: none}
/* CORPO DELLE VARIE SEZIONI */
.aa {background-image: none; background-color: #.....}
.bb {background-image: none; background-color: #....}
.xx, .yy, .zz {background-image: none; background-color: #......}
/* CORPO DEI VARI TOPIC */
.forum .ww {background-image: none; background-color: #.....}
.cc {background-image: none; background-color: #.....}
/* LINEE DI SEPARAZIONE(Griglia che compone Forum) */
.aa, .bb, .xx, .yy, .ww, .cc, .zz {border-bottom: 1px solid #D5D5D5; border-right: 1px solid #.....}
/* TITOLI DELLE SEZIONI E DEI TOPIC */
.web {font-size: 11pt; font-family: segoe ui; text-decoration: none; line-height: 150%}
.web a:link, .web a:visited {font-size: 11pt; color: black; text-decoration: none; font-weight: none}
.web a:hover {font-size: 11pt; color: #2779E9; text-decoration: underline; font-weight: bold}
/* DESCRIZIONI E SOTTOTITOLI */
.desc {text-align: none; font-style: none; text-decoration: none; font-weight: none; font-size: 10px; font-family: segoe ui; color: #.....}
/* SCRITTE "NUMERO MESSAGGI", "AUTORE", ECC.. */
.xx, .cc, .yy {font-size: 10px; font-family: segoe ui; font-weight: none; color: #....}
/* DETTAGLI ULTIMO MESSAGGIO(Data, In:.., Di:..) */
.zz {font-size: 11px; font-family: segoe ui; font-weight: none; color: #.....}
/* DETTAGLI ULTIMO MESSAGGIO(In quale sezione, e autore) */
.board .zz a:link, .board .zz a:visited {font-size: 11px; font-family: segoe ui; font-weight: none; text-decoration: none; font-style: italic; color: #......}
.board .zz a:hover {font-size: 11px; font-family: segoe ui; font-weight: none; text-decoration: underline; font-style: italic; color: #.......}
/* SFONDO GENERALE DEI TOPIC, RISP RAPIDA E CASELLA DI RISPOSTA */
.topic .mainbg, .msg .mainbg {background-color: #......}
/* SFONDO GENERALE HOME PAGE /SEZIONI PRINCIPALI e SOTTOSEZIONI) */
.board .mainbg, .forum .mainbg {background-color: #.........}
/* ------ F I N E ------ */

/* ----------------IMPOSTAZIONI SONDAGGI E TOPIC------------------ */
/* BARRA ALTA DEI SONDAGGI */
.title2 {background-color: none; background-image: url(http://......); repeat: repat-x}
/* BARRA BASSA DEI SONDAGGI */
.row2 {background-color: none; background-image: url(http://.......); repeat: repat-y}
/* SCRITTE BARRE ALTA E BASSA DEI SONDAGGI */
.title2, .row2, a:link {font-weight: bold; font-family: segoe ui; font-size: 11px; color: #......}
.title2, .row2, a:visited {font-weight: bold; font-family: segoe ui; font-size: 11px; color: #......}
.title2, .row2, a:hover {font-weight: bold; font-family: segoe ui; font-size: 11px; color: #.......}
/* RISPOSTE DEL SONDAGGIO E ANTEPRIMA DEI VARI MESSAGGI */
.row1 {font-weight: none; font-family: segoe ui; font-size: 13px; text-decoration: none; font-style: none; color: black}
.row1 {background-color: #......}
/* DIVISORE FRA LE VARIE RISPOSTE DEL SONDAGGIO */
.row1 {border-bottom: 1px dotted #.......}
/* BARRE GRAFICHE PERCENTUALI DELLE VOTAZIONI */
.bar {background-image: url(http://......)}
.bar_left {background-image: url(http://........)}
.bar_right {background-image: url(http://......)}
/* ------ F I N E ------ */

/* -------------------IMPOSTAZIONI DEL TOPIC-------------------- */
/* PARTE ALTA DX: Inviato il...e PULSANTI MODIF, QUOTA:... */
.right_top {background-image: url(http://........); repeat: repeat-x; background-color: none}
/* PARTE ALTA SX: Dove c'è nome utente sopra avatar */
.left_top {background-image: url(http://........); repeat: repeat-x; background-color: none}
/* PARTE ALTA APPENA SOTTO LA CORNICE AERO */
.topic .title {background-image: none; background-color: #......}
/* BORDI CHE COMPONGONO UN TOPIC */
.left {border-right: 1px dotted #.....}
/* SFONDO GENERALE DI UN TOPIC O UNA RISPOSTA */
.right {background-image: none; background-color: #......}
/* DIVISORE FRA LE VARIE RISPOSTE DI UN TOPIC */
.sep_left {display:none}
.sep {display:none}
.sep_right {display:none}
/* NICKNAME SOPRA L'AVATAR */
.nick a:link, .nick a:visited {font-weight: bold; font-family: segoe ui; font-size: 12px; text-decoration: none; font-style: none; color: #.....}
.nick a:hover {font-weight: bold; font-family: segoe ui; font-size: 12px; text-decoration: underline; font-style: none; color: #......}
/* DETTAGLI APPARTENENZA GRUPPO */
.details p {font-weight: bold; font-family: segoe ui; font-size: 11px; text-decoration: none; font-style: none; color: #.....}
/* DETTAGLI DEL PROPRIO PROFILO */
.details {font-weight: none; font-family: segoe ui; font-size: 11px; text-decoration: none; font-style: none; color: #......}
/* TIPO DEL CARATTERE NEL TOPIC E DEI VARI LINK */
.right {font-weight: none; font-family: segoe ui; font-size: 12px; text-decoration: none; font-style: none; color: #......}
.right a:link, .right a:visited {font-weight: none; font-family: segoe ui; font-size: 15px; text-decoration: underline; font-style: italic; color: #.......}
.right a:hover {font-weight: none; font-family: segoe ui; font-size: 15px; text-decoration: underline; font-style: italic; color: #......}
/* SCRITTA "CITAZIONE" SOPRA AL RIQUADRO QUOTE */
.quote_top {font-weight: none; font-family: segoe ui; font-size: 11px; text-decoration: none; font-style: italic; color: #......}
/* RIQUADRO DELLE CITAZIONI O QUOTE*/
#quote {font-family: segoe ui; font-size: 12pt; font-style: italic; color: #000; background-color: #......; filter:progid:dximagetransform.microsoft.gradient(gradienttype=0, startcolorstr=#B2CDFF, endcolorstr=#528FFD); border: 1px solid #528FFD; padding: 2px}
/* SCRITTA "SPOILER" E "CODICE" SOPRA AL RIQUADRO CODE, SPOILER */
.code_top {font-weight: none; font-family: segoe ui; font-size: 11px; text-decoration: none; font-style: italic; color: #.......}
/* RIQUADRO DELLO SPOILER E DEL CODICE */
#code {font-size: 12pt; font-family: courier; color: #000; background-color: #.........; filter:progid:dximagetransform.microsoft.gradient(gradienttype=0, startcolorstr=#FAB5BA, endcolorstr=#FF4E5B); border: 1px solid #FF4E5B; padding: 2px}
/* SCRITTA IN BASSO AL TOPIC "MODIFICATO DA..." */
.edit {font-weight: none; font-family: segoe ui; font-size: 10px; text-decoration: none; font-style: italic; color: #.......}
/* DIVISORE FRA TOPIC E FIRMA PERSONALE */
.bottomborder {border-bottom: 1px dashed #.....}
/* PULSANTI DELLA RISPOSTA RAPIDA */
#board .codebuttons {color: #....; font-style: none; font-weight: none; font-family: segoe ui; font-size: 11px}
/* PULSANTI "AGGIUNGI LA RISPOSTA" E "ANTEPRIMA" */
.forminput {color: #.....; font-style: none; font-weight: none; font-family: segoe ui; font-size: 11px}
/* LINK PRESENTI IN RISPOSTA RAPIDA */
#board a:link, #board a:visited {color: #.....; font-style: none; font-weight: none; font-family: segoe ui; font-size: 11px}
#board a:hover {color: #.......; font-style: none; font-weight: none; font-family: segoe ui; font-size: 11px}
/* SFONDO GENERICO DE RISPOSTA RAPIDA */
#board .msg_main {background-color: #.......}
/* CASELLA DI TESTO IN RISPOSTA RAPIDA, NUOVO TOPIC E RISPONDI */
.msg .textinput {color: #......; font-style: none; font-weight: none; font-family: segoe ui; font-size: 12px}
/* MESSAGGI DI ERRORE */
.alert {color: #......; font-style: italic; font-weight: bold; font-family: segoe ui; font-size: 11px; text-decoration: underline}
/* SCRITTA "NON CI SONO DISCUSSIONI" */
.forum .aa b {color: #........; font-style: none; font-weight: bold; font-family: segoe ui; font-size: 12px}
/* ------ F I N E ------*/

/* --------------------------NUOVO TOPIC------------------------ */
/* PULSANTI */
.msg .codebuttons {color: #......; font-style: none; font-weight: none; font-family: segoe ui; font-size: 11px}
/* LINK SELEZIONABILI */
.msg a:link, .msg a:visited {color: #.......; font-style: none; font-weight: none; font-family: segoe ui; font-size: 11px}
.msg a:hover {color: #59C4FF; font-style: none; font-weight: none; font-family: segoe ui; font-size: 11px}
/* SFONDO GENERICO TOPIC, RISPONDI */
.msg .msg_main, .darkbar {background-color: #.....}
/* TUTTO LE ALTRE SCRITTE */
.msg_txt {color: #......; font-style: none; font-weight: none; font-family: segoe ui; font-size: 11px}
.msg .darkbar {color: #.....; font-style: none; font-weight: none; font-family: segoe ui; font-size: 11px}
/* RIGHE DI SEPARAZIONI DLLE FUNZIONI */
.msg .mainbg {background-color: #.......}
/* SFONDO FUNZIONI */
.msg .darkbar {background-color: #........}
/* SCRITTA "FACCINE" e "ALTRE FACCINE */
.row3 {color: #......; font-style: italic; font-weight: none; font-family: segoe ui; font-size: 12px}
/* LINEA GENERALE -HR- */
hr {color: #......}
/*-----------------------------------------------------------------*/
/* ------ F I N E ------ */

*/ --------------------------STATISTICHE-------------------------- */
/* BORDO DELLA TABELLA STATISTICHE */
.stats .skin_tbl_border {border: 1px solid #......}
.stats .border {background-color: white; border: 1px solid #......; padding: 0}
/* SFONDO DELLA BARRA PRINCIPALE ALTA STAT */
.stats .title2 {background-color: #.......}
.stats .sunbar {background-color: #.......}
/* SCRITTA "STATISTICHE" BORDO ALTO */
.stats .title2 {font-family: segoe ui; font-size: 18px; font-weight: bold; font-style: italic; text-decoration: underline; color: #......; text-align: right; letter-spacing: 4px}
/* BORDO INTERNO, TITOLO PRINCIPALE */
.border .title2 {padding-left: 21px}
/* SFONDO DEI SOTTOTITOLI */
.sunbar {background-color: #........}
/* SCRITTE DEI SOTTOTITOLI */
.sunbar {font-family: segoe ui; font-size: 11px; font-weight: bold; text-decoration: underline; text align: center; color: #......}
/* CORPO DELLE STATISTICHE */
.stats .ww {width: 0%; padding: 10px; background-image:none}
.stats .aa {width: 100%; background-image:none; padding: 10px}
/* SCRITTE UTENTI, LEGENDE, ECC.. */
.stats .aa {color: #.....; font-family: segoe ui; font-weight: none; font-style: none; font-size: 11px}
.stats .aa a:hover {color: #.......; font-family: segoe ui; font-weight: bold; font-style: italic; text-decoration: underline; font-size: 11px}
.stats .ww a:link, .aa a:visited {color: #......; font-style: none}
/* SCRITTE DETTAGLI FORUM E POSIZIONE IN TOP FORUM */
.stats .ww {color: #......; font-family: segoe ui; font-weight: none; font-style: none; font-size: 11px}
.stats .ww a:hover {color: #......; font-family: segoe ui; font-weight: bold; font-style: italic; text-decoration: underline; font-size: 11px}
.stats .aa a:link, .aa a:visited {color: #......; font-style: none}
/* ------ F I N E ------ */

/* ---------------COLORI GRUPPI E UTENTI ATTIVI------------------ */
.amministratore {color: #F40000; font-weight: bold; font-size: 11px}
.moderatore {color: #002EF4; font-weight: bold; font-size: 11px}
.utente {color: #00ACF4; font-weight: bold; font-size 11px}
.daconvalidare {color: #B5B5B5; font-style: italic; font-size: 11px}
.gruppo1 {color: #B980FF; font-weight: bold; font-size: 11px}
.gruppo2 {color: #80A9FF; font-weight: bold; font-size: 11px}
.gruppo3 {color: #95DDFF; font-weight: bold; font-size: 11px}
.gruppo4 {color: #9FEF50; font-weight: bold; font-size: 11px}
.gruppo5 {color: #FFF000; font-weight: bold; font-size: 11px}
.gruppo6 {color: #FFB56A; font-weight: bold; font-size: 11px}
/* ------ F I N E ------ */

/* --------IMPOSTAZIONI RIGUARDANTI AL PROFILO E MODIFICA-------- */
.pagetitle {font-size: 25px; font-weight: bold; font-style: none; letter-spacing: 2px; word-spacing: 4px; font-family: segue ui}
.pagetitle a:link, .pagetitle a:visited {font-size: 25px; font-weight: bold; font-style: italic; letter-spacing: 2px; word-spacing: 4px; font-family: segue ui}

/* -------------------IMPOSTAZIONI DEL MESSENGER------------------ */
/* SFONDO DEI SOTTOTITOLI */
.title3 {background-image: none; background-color: #.....}
/* SCRITTE DEI SOTTOTITOLI */
.msg .title {font-weight: bold; font-family: segoe ui; font-size: 10px; color: black}
/* ------ F I N E ------ */

/* -------------------IMPOSTAZIONI DELLE FIRME-------------------- */
/* ALTEZZA E LARGHEZZA DELLE FIRME */
.signature {overflow: auto; height: 200px; width: auto}
/* ------ F I N E ------*/
/* --------------------------------------------------------------- */

Web

2 replies since 8/3/2010, 14:44 75 views