Discussione: Come faccio a mettere uno sfondo di 3 gif sulle cat?

Originariamente Scritto da Demo16

salve a tutti ragazzi,
ho appena comprato il favoloso Vbullettin e sto personalizzandolo.

Vorrei personalizzare la riga delle categorie.
L'originale è come ben saprete è così:

#869BBF url(images/gradients/gradient_tcat.gif) repeat-x top left

con un gradiente di 100x100px in gif che viene ripetuto.

Io vorrei ripetere un altro file sempre di 100x100gif ma vorrei che l'inizio e la fine avessero una chiusura diversa fatta da altri 2 files

ho pensato di impostarla così ma non ha funzionato:

transparent url(images/gradients/gradient_tcat_01.gif) url(images/gradients/gradient_tcat_02.gif) repeat-x top left url(images/gradients/gradient_tcat_03.gif)

dove sbaglio?

Devi modificare il CSS.Ciao

come? da dove? aiutoooo

Originariamente Scritto da Demo16

salve a tutti ragazzi,
ho appena comprato il favoloso Vbullettin e sto personalizzandolo.

Vorrei personalizzare la riga delle categorie.
L'originale è come ben saprete è così:

#869BBF url(images/gradients/gradient_tcat.gif) repeat-x top left

con un gradiente di 100x100px in gif che viene ripetuto.

Io vorrei ripetere un altro file sempre di 100x100gif ma vorrei che l'inizio e la fine avessero una chiusura diversa fatta da altri 2 files

ho pensato di impostarla così ma non ha funzionato:

transparent url(images/gradients/gradient_tcat_01.gif) url(images/gradients/gradient_tcat_02.gif) repeat-x top left url(images/gradients/gradient_tcat_03.gif)

dove sbaglio?

Il Gradiente è Uno solo, poi se vuoi mettere delle immagini devi proprio modificare lo Style

Originariamente Scritto da Sergio

Il Gradiente è Uno solo, poi se vuoi mettere delle immagini devi proprio modificare lo Style

Si grazie ho capito ma da dove lo modifico e come?

Originariamente Scritto da Demo16

Si grazie ho capito ma da dove lo modifico e come?

Se vuoi fare un lavoro come da screenshot allegato DEVI modificare il CSS.Ciao

PS

non posso allegare la foto e ti lascio il link.

www.chatomeka.com/screeshot.gif

Originariamente Scritto da Enzo

Se vuoi fare un lavoro come da screenshot allegato DEVI modificare il CSS.Ciao

PS

non posso allegare la foto e ti lascio il link.

www.chatomeka.com/screenshot.gif

Cambiato il link.Ciauz

grazie enzo mi hai capito alla perfezione mi daresti l'esempio del tuo css? non risco a capire dove e come editare

secondo me ti converrebbe usare i div e mettere un'immagine a sinistra (piccola) e poi uno sfondo che si ripete, anche perchè potresti avere dei problemi dopo quando la cella viene auto ridimensionata dallo script per certi tipi di tabelle...

Originariamente Scritto da neonix

secondo me ti converrebbe usare i div e mettere un'immagine a sinistra (piccola) e poi uno sfondo che si ripete, anche perchè potresti avere dei problemi dopo quando la cella viene auto ridimensionata dallo script per certi tipi di tabelle...

Assolutamente NO,io ho modificato inserendo il tutto in un foglio di blocco notes e poi l'ho rinominato vbitalia.css.Ti lascio un esempio di CSS per poterlo studiare e adattarlo al tuo skin.Ciao

ody
{
background: #FFFFFF url(bg.gif);
color: #000000;
font: 10pt verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
margin: 0px 0px 0px 0px;
padding: 0px;
}
a:link, body_alink
{
color: #000000;
text-decoration: none;
}
a:visited, body_avisited
{
color: #000000;
text-decoration: none;
}
a:hover, a:active, body_ahover
{
color: #C6C6C6;
text-decoration: none;
}
.page
{
background: #FFFFFF url(bg.gif);
color: #000000;
}
td, th, p, li
{
font: 10pt verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
}
.tborder
{
background: url(gradient_tcat.gif);
color: #000000;
border: 0px solid ;
}
.tcat
{
background: #000000 url(tcat.gif) repeat-x top left;
color: #000000;
font: bold 10pt verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
}
.tcat a:link, .tcat_alink
{
color: #000000;
text-decoration: none;
}
.tcat a:visited, .tcat_avisited
{
color: #000000;
text-decoration: none;
}
.tcat a:hover, .tcat a:active, .tcat_ahover
{
color: #DEDEDE;
text-decoration: none;
}
.thead
{
background: url(images/gradients/gradient_tcat.gif) repeat-x top left;
color: #000000;
font: bold 11px tahoma, verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
}
.thead a:link, .thead_alink
{
color: #FFFFFF;
text-decoration: none;
}
.thead a:visited, .thead_avisited
{
color: #FFFFFF;
text-decoration: none;
}
.thead a:hover, .thead a:active, .thead_ahover
{
color: #DCDCDC;
text-decoration: none;
}
.tfoot
{
background: #000000 url(tcat.gif) repeat-x top left;
color: #FFFFFF;
}
.tfoot a:link, .tfoot_alink
{
color: #FFFFFF;
text-decoration: none;
}
.tfoot a:visited, .tfoot_avisited
{
color: #FFFFFF;
text-decoration: none;
}
.tfoot a:hover, .tfoot a:active, .tfoot_ahover
{
color: #DEDEDE;
text-decoration: none;
}
.alt1, .alt1Active
{
background: #FBFBFB;
color: #000000;
}
.alt2, .alt2Active
{
background: #ffffff;
color: #000000;
}
td.inlinemod
{
background: #FFFFCC;
color: #000000;
}
.wysiwyg
{
background: #F5F5FF;
color: #000000;
font: 10pt verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
}
textarea, .bginput
{
font: 10pt verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
}
.button
{
font: 11px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
}
select
{
font: 11px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
}
option, optgroup
{
font-size: 11px;
font-family: verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
}
.smallfont
{
font: 11px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
}
.time
{
color: #000000;
}
.navbar
{
font: 11px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
}
.highlight
{
color: #FF0000;
font-weight: bold;
}
.fjsel
{
background: #3E5C92;
color: #FFFFFF;
}
.fjdpth0
{
background: #F7F7F7;
color: #000000;
}
.panel
{
background: #F5F5F5 repeat-x top left;
color: #000000;
padding: 10px;
border: 2px outset;
}
.panelsurround
{
background: #E0E0E0 repeat-x top left;
color: #000000;
}
legend
{
color: #000000;
font: 11px tahoma, verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
}
.vbmenu_control
{
background: #000000 url(tcat.gif) repeat-x top left;
color: #FFFFFF;
font: bold 11px tahoma, verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
padding: 3px 6px 3px 6px;
white-space: nowrap;
}
.vbmenu_control a:link, .vbmenu_control_alink
{
color: #FFFFFF;
text-decoration: none;
}
.vbmenu_control a:visited, .vbmenu_control_avisited
{
color: #FFFFFF;
text-decoration: none;
}
.vbmenu_control a:hover, .vbmenu_control a:active, .vbmenu_control_ahover
{
color: #FFFFFF;
text-decoration: underline;
}
.vbmenu_popup
{
background: #FFFFFF;
color: #000000;
border: 1px solid #0B198C;
}
.vbmenu_option
{
background: #D3D3D3;
color: #000000;
font: 11px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
white-space: nowrap;
cursor: pointer;
}
.vbmenu_option a:link, .vbmenu_option_alink
{
color: #000000;
text-decoration: none;
}
.vbmenu_option a:visited, .vbmenu_option_avisited
{
color: #000000;
text-decoration: none;
}
.vbmenu_option a:hover, .vbmenu_option a:active, .vbmenu_option_ahover
{
color: #FFFFFF;
text-decoration: none;
}
.vbmenu_hilite
{
background: #8A949E;
color: #FFFFFF;
font: 11px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
white-space: nowrap;
cursor: pointer;
}
.vbmenu_hilite a:link, .vbmenu_hilite_alink
{
color: #FFFFFF;
text-decoration: none;
}
.vbmenu_hilite a:visited, .vbmenu_hilite_avisited
{
color: #FFFFFF;
text-decoration: none;
}
.vbmenu_hilite a:hover, .vbmenu_hilite a:active, .vbmenu_hilite_ahover
{
color: #FFFFFF;
text-decoration: none;
}
/* ***** styling for 'big' usernames on postbit etc. ***** */
.bigusername { font-size: 14pt; }
/* ***** small padding on 'thead' elements ***** */
td.thead, div.thead { padding: 4px; }
/* ***** basic styles for multi-page nav elements */
.pagenav a { text-decoration: none; }
.pagenav td { padding: 2px 4px 2px 4px; }
/* ***** define margin and font-size for elements inside panels ***** */
.fieldset { margin-bottom: 6px; }
.fieldset, .fieldset td, .fieldset p, .fieldset li { font-size: 11px; }
/* ***** don't change the following ***** */
form { display: inline; }
label { cursor: default; }
.normal { font-weight: normal; }
.inlineimg { vertical-align: middle; }
.banner1{background: url(banner1.gif) top left no-repeat ; height:157px}
.banner2{background: url(banner2.gif) top left repeat-x ; height:157px}
.banner3{background: url(banner3.gif) top right no-repeat ; height:157px}
.footer1{background: url(footer1.gif) top left repeat-x ; height:23px}
.footer2{background: url(footer2.gif) top right no-repeat ; height:23px}
.b1{background: url(b1.gif) top left no-repeat ; height:28px}
.b2{background: url(b2.gif) top left repeat-x ; height:28px}
.b3{background: url(b3.gif) top right no-repeat ; height:28px}
.boxd{ background: #000000 url(boxduoi.gif) repeat-x ; height:8px }

.tcat2
{
color: #000000;
font: bold 10pt verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
padding-left: 70px;
padding-top: 3px;
}
.tcat2 a:link, .tcat2_alink
{
color: #000000;
text-decoration: none;
}
.tcat2 a:visited, .tcat2_avisited
{
color: #000000;
text-decoration: none;
}
.tcat2 a:hover, .tcat2 a:active, .tcat2_ahover
{
color: #878787;
text-decoration: none;
}