Webboard

Webboard > Wsparcie MyBB > Style, szablony i grafika > Gradient na obrazku tła
Pełna wersja: Gradient na obrazku tła
Aktualnie przeglądasz uproszczoną wersję forum. Kliknij tutaj, by zobaczyć wersję z pełnym formatowaniem.

Bio-moto

27.10.2011, 13:19
wersja skryptu MyBB: 1.6.4
adres forum: http://moto-poludnie.pl/forum/
na czym polega problem (screen, opis, komunikaty, nazwa stylu/theme/szablonu):
Problem wynikający z niewiedzy ;)

Otóż mam sobie tło na forum - jest to powtarzalny element x*x pixeli.
W górnej części chciałbym dać gradient "rozjaśniający" (przygotuję sobie obrazek) a w dolnej "ściemniający".

Jak to rozwiązać? Myślałem o wrzuceniu 3 obrazków - jeden na górę z rozjaśnieniem, drugi w środek z tłem i 3-ci na dół ze ściemnieniem.
Ew. drugi sposób - png na górę i png na dole.

Jak to rozwiązać w CSS?

Bako

27.10.2011, 13:51
Kod PHP:
background: url(1.png), url(3.png), url(2.png); /* Ścieżka obrazków */
background-repeat: repeat-x, repeat-x, repeat; /*Powtarzanie*/
background-position: top, bottom, left top; /*Położenie*/ 

saturnine

27.10.2011, 13:57
na przykład możesz w body dać to co wypluje ten generator: http://gradients.glrzad.com/,
problem w tym że nie masz jednokolorowego piksela tylko obrazek 6x6

Bio-moto

27.10.2011, 14:02
Bako, rozumiem, że w Twoim kodzie idąc od lewej obrazek u góry, obrazek na dole, reszta tła?

saturnine - generator ma 404 ;)

saturnine

27.10.2011, 14:03
usun przecinek, wkleił mi sie

Bako

27.10.2011, 16:31
Kod na trzy obrazki.

Pierwszy na górze, powtarzany od lewej.
Drugi na dole, powtarzany od lewej.
Trzeci na środku, powtarzany wszędzie.

Bio-moto

28.10.2011, 06:38
jutro przetestuję i dam znać, czy działa :)

Bio-moto

01.11.2011, 20:18
przy tym kodzie, tło robi się białe, więc niezbyt to działa :/

(chodzi oczywiście o kod Bako)

Bako

01.11.2011, 22:10
Musi działać bo mi działa.

Skopiuj ten kod ze swojego global.css

Bio-moto

01.11.2011, 22:29
Kod:
body {
        background: url(images/1/tlo/t.gif), url(images/1/tlo/b.gif), url(images/1/tlo/m.gif);
        background-repeat: repeat-x, repeat-x, repeat;
        background-position: top, bottom, left top;     
        color: #000;
    text-align: center;
    line-height: 1.4;
    margin: 0;
    font-family: Tahoma, Verdana, Arial, Sans-Serif;
    font-size: 13px;
}

gloverek

01.11.2011, 22:30
Polecam również tą stronkę http://www.westciv.com/tools/gradients/index.html

Bio-moto

01.11.2011, 22:32
coś się zmieniło - widać tylko to co u góry...

ok działa - musiałem walnąć pełne linki do każdego obrazka O.o
Webboard > Wsparcie MyBB > Style, szablony i grafika > Gradient na obrazku tła