ďťż

Grafika jako tło?

Podstrony

telcocafe

Coraz częściej widzę (np. tutaj http://img.photobuck...designcopy.jpg) obrazek jako tło. Jak można obrazek o rozmiarach powiedzmy 3px na 3px dać jako samo powielające się tło? Interesuje mnie jak zrobić w photoshopie tak, aby "skopiować" taki obrazek na całe tło.

W Photoshopie tworzysz właśnie obrazek 3px x 3px, a powielasz go kodem HTML ;) Jak - to juz odsyłam to pierwszego lepszego kursu HTML.

P.S. Gdzie tam w linku jest powielane tło?

Chodzi ci o brzegi? Tzn. ta drobna krateczka? Nie powiem ci jak w PS ale pewnie podobnie jak w gimpie, a w gimpie to robisz tak:
Wybierasz narzędzie wypełnienia (kubełek), z opcji narzędzia wybierasz "deseń" i z palety desenie wybierasz co ci pasuje, a potem klikasz np. w zaznaczenie i masz ładny wzorek :)

@up: powielanie tła masz choćby w tłach nagłówków menu itp. Tam gdzie taki sam gradiencik ciągnie się kawałek ;)

@Couler: w zależności, czy grafika ma się powtarzać, czy nie, tak ustalasz jej wymiary. Na przykład, jeśli ma się powtarzać w poziomie, robisz obrazek o wybranej wysokości i szerokości 1px. Gdy pionowo, odwrotnie.
I masz HTMLowski przykład powtarzania ;)<div style="background-image: url(obrazek.jpg); background-repeat: repeat-x;">Menu</div>
Po więcej odsyłam tutaj oraz tutaj ;)

PS Jeśli chcesz wykonać coś takiego jedynie w PS-ie, to musisz zdefiniować Pattern'a, a później go powielić ;) Jak to zrobić, znajdziesz w każdym tutku na userbara ;)
Użytkownik DJ_ProG edytował ten post 03 kwiecień 2007, 16:11

@ DJ_ProG
"PS Jeśli chcesz wykonać coś takiego jedynie w PS-ie, to musisz zdefiniować Pattern'a, a później go powielić wink2.gif Jak to zrobić, znajdziesz w każdym tutku na userbara"

Ok sprawdza się, ale nie mogę zrobić jednej rzeczy . Przy definiowaniu pattern'a (ukośna linia), chcę aby tło było "transparent" . Kiedy probuje tak zrobić, to nie mogę wtedy zdefiniować takiego patterna...
Użytkownik couler edytował ten post 03 kwiecień 2007, 16:38
O_o a czy zaznaczony fragment canvasa, którego chcesz dać jako patterna ma przeźroczyste piksele? Jeśli tak, to nie wiem, w czym wina :/ Popytaj zawodowych grafików...

Toc to proste, w kodzie HTML dajesz <body background="plik.jpg"> i masz jako samopowielajace sie tlo obrazek z pliku.jpg :P

A taki obrazek mozesz latwo przygotowac w dowolnym programie graficznym, nawet w Paincie :P

Znowu mam problem.
Grafika musi się powtarzać w poziomie i w pionie. Jednak z tym pionem jest problem , bo gradient musi być odwrócony, aby to jakoś wyglądało, a w poziomie gradient nie może być odwrócony, tylko normalnie. Jak to zrobić?

Tworzysz sobie obrazek z odpowiednim gradientem, np. na górze i na dole niebieski, w środku biały, czy jakie kolory chcesz;]

Chyba nikt nie rozumie o co mi chodzi :P Mam powiedzmy takie layout:
http://img255.images...53/indexec6.jpg
Wszystko ładnie pocięte w photoshopie itp. Jak teraz zrobić tło , żeby to miało ręce i nogi? Wg mnie najlepiej byłoby "po bokach" (czyli tam gdzie kończy się tło zrobione tło w photoshopie) dać powtarzający się gradient, a na górze i dole odwrócony i też, żeby sam się powtarzał. Tylko jak zrobić takie coś?

Zbyt nie rozumiem, ale gdybym musiał podłożyć tło takie jak ty tam masz, to przez gradient niebieski (ciemniejący idąc w dół) musiałbym wyciąć obrazek o wysokości całej grafiki i o takiej szerokości, by mogło się spokojnie poziomo powtarzać (a pionowo już nie będzie takiej potrzeby :P)

Łapiesz ?

Nie zrozumiałem... możesz napisać trochę prościej lub na jakimś przykładzie to wytłumaczyć?

Zamiast obrazka 3x3 px dajesz 3x746 px :P
Chodzi o to że wysokość abrazka ma być taka jak wysokość całej strony wtedy będziesz powielał tylko poziomo (repeat x) :)

No tak ,a jeżeli ktoś ma większą rozdzielczość? Wtedy u góry i u dołu strony pojawi się u niego białe tło...

No niestety - coś kosztem czegoś :)

No niestety - coś kosztem czegoś smile.gif
To jest najgorsze podejście z możliwych;/

Rozwiązania proponuję 2:
a) na dole delikatnie przechodzisz w obrazku do białego koloru;
b ) tak jak napisałem wyżej, na górze i na dole obrazka te same odcienie i wtedy powtarzasz obrazek nie tylko w poziomie ale i w pionie
Użytkownik kutar edytował ten post 24 kwiecień 2007, 19:18

Sitedesign by AltusUmbrae.

Darmowy hosting zapewnia PRV.PL