Gradientowany thead.

wersja skryptu MyBB:1.6.2
adres forum:konsolka.eu
na czym polega problem (screen, opis, komunikaty, nazwa stylu/theme/szablonu):

Witam ponownie! Chciałbym się zapytać, jak zrobić "gradientowaną ramkę" (thead). Chodzi mi o to, żeby ramka nie była w jednym kolorze, ale miejscami pojawiał się jakiś inny (jak na http://podziemieopowiadan.pl albo vBulletinowskim http://precyl.pl).

Musisz sobie stworzyć paseczek o odpowiedniej szerokości i wysokości. Wszystko zależy do tego, jaką grafikę wykonasz.

Spójrz sobie na thead domyślnego stylu. To jest tylko mały paseczek odpowiednio wykonany w programie graficznym. Oczywiście jeszcze został ostylowany CSS'em, w np. taki sposób:

#026CB1 url(images/thead_bg.gif) top left repeat-x

#kolor odnośnik do obrazka umiejscowienie powtarzanie

Najlepiej zajrzyj do poradnika:
Podstawy CSS

Dobra, ale gdybym chciał wstawić obrazek jako tło, ale nie przy thead tylko przy:

.trow_sep {
background: #558f2b;
color: #fff;
border-bottom: 1px solid #c5c5c5;
padding: 6px;
font-size: 12px;
font-weight: bold;
}


to co mam zrobić? Mój obrazek o wymiarach takich jak trow_sep znajduje się tu:
http://konsolka.eu/images/konsolka/thead2_bg.gif

virus4 napisał(a):Tło:
1. Kolor - selektor { background-color: kolor }
Za kolor podstawiamy jakiś kolor w zapisie szesnastokwym lub po angielsku.

2. Tło obrazkowe - selektor { background-image: url(ścieżka dostępu do obrazka) }
Za ścieżka dostępu do obrazka podajemy ścieżkę do obrazka.

3. Powtarzanie - selektor { background-repeat: powtarzanie }
Za powtarzanie podstawiamy:

repeat - powtarzanie tła w obu kierunkach (domyślnie)
repeat-x - powtarzanie tła tylko w kierunku poziomym
repeat-y - powtarzanie tła tylko w kierunku pionowym
no-repeat - brak powtarzania tła (zostanie wyświetlone jako pojedynczy obrazek)

Sorki, że cię dręczę, ale mógłbyś mi podedytować jak głupiemu?

Tutaj chciałbym, aby tylko po lewej na brzegu pojawił się ten obrazek:

KOD:
.thead {
background: #000000;
color: #ffffff;
padding-left: 10px;
padding-right: 3px;
padding-top: 3px;
padding-bottom: 3px;
}

LINK DO OBRAZKA:
http://konsolka.eu/images/konsolka/thead_bg.gif

A tutaj, żeby jeden obrazek był całym tłem (powtarzał się):

KOD:
.trow_sep {
background: #558f2b;
color: #fff;
border-bottom: 1px solid #c5c5c5;
padding: 6px;
font-size: 12px;
font-weight: bold;
}

LINK DO OBRAZKA:
http://konsolka.eu/images/konsolka/thead2_bg.gif

po prostu żebyś mi wpisał tam to, co ma być okej? Z góry ogromne dzieki

Powyżej obrazek powtarza się poziomo, jak chcesz pionowo, ustaw repeat-y.

Nie wiem, czy kod da taki efekt, jakiego oczekujesz, bo sam nie wiem jakiego efektu oczekujesz.

.trow_sep {
background: #558f2b url('images/konsolka/thead2_bg.gif') repeat-x;
color: #fff;
border-bottom: 1px solid #c5c5c5;
padding: 6px;
font-size: 12px;
font-weight: bold;
}


To dało taki efekt o jaki mi chodziło.

Ale przy:
.thead {
background: #000000 url('images/konsolka/thead_bg.gif');
color: #ffffff;
padding-left: 10px;
padding-right: 3px;
padding-top: 3px;
padding-bottom: 3px;
}

chciałbym, aby obrazek pojawił się tylko raz po lewej stronie - przy krawędzi thead. Rozumiesz?

Obrazek powinien się pokazać po lewej, tylko jeden raz. Ustawienie po lewej jest domyślnym.