Forum PHP.pl

Witam!



Jak za pomocą standardowego CSS lub jakiejkolwiek innej moteody (prócz CSS3) uzyskać tło z dwóch obrazków w przedstawiony poniżej sposób:



Jedyny pomysł jaki przychodzi mi na myśl to skorzystanie z div, byćmoże zna ktoś bardziej poprawny sposób

Dziękuję i pozdrawiam

Jeżeli tło ma być samym kolorem, to chyba lepiej to bez obrazków zdefiniować jako background-color. Jeśli natomiast to jest tylko przykład, to faktycznie div'y są dobrym rozwiązaniem, tylko czy tekst albo inna zawartość strony ma być w takim wypadku rozdzielony na dwie kolumny, czy ma się wyświetlać na całości?

tekst nie będzie w 2 kolumnach jeśli skorzysta z pozycjonowania odpowiedniego warstw w css - czyli warstwę 3 na oba te divy - a w zasadzie żeby to się lepiej trzymało kupy i mniej inwencji wymagało to te trzy warstwy wewnątrz jakiegoś jeszcze innego "pudełka" (np. diva) - i ta trzecia warstwa jest na zawartość treści - no niestety też innego sposobu nie znam ;/

Drodzy forumowicze chodzi tutaj o tło całej strony (bez żadnych divów, czy też tabel).

Po prostu mam dwa obrazki przykladowo: tlo1.jpg i tlo2.jpg i chciałbym ustawić je jako tło strony w w/w sposób

Nie znam odpowiedzi na twoje pytanie, ale może ci to pomoże:
https://developer.mozilla.org/pl/CSS/background-position
(jeżeli jest to możliwe to myśle że uda ci się to zrobić ustawiając 2 tła i do nich poszczególne pozycje)

Edit: zawsze możesz połączyć dwa tła i zrobić jedno

Ten post edytował qba10 17.09.2009, 17:00:27

Jedyne wyjście, to wstawienie drugiego div z position absolute 50% od lewej. background nie może przyjmować kilku obrazków.

Tak własnie myślałem, aczkolwiek w nowym css jest już taka możliwość, dziękuję za odpowiedź

Faktycznie, nie ustawisz na background kilku obrazków, ale można by pomyśleć aby zrobić coś takiego:

dla html ustawiasz background jako obrazek 1, dajesz mu left oraz no-repeat, a dla body ustawiasz obrazek 2 na right i no repeat. Oba obrazki powinny być dobrze przycięte aby to zadziałało - jednakże może być problem z wyglądem przy różnych rozdzielczościach strony ( nie pokazałeś konkretnych obrazków, więc nie wiadomo czy będzie z tym problem czy nie ).

Innym sposobem, może być takie potrójne pudełko, jakie chyba już ktoś wyżej proponował. Aby się nie rozpisywać, podam przykładowy kod:

[HTML] pobierz, plaintext 
<div id="all">
	<div id="all2">
		<div id="content">
 
 
		</div>
	</div>
</div>
 
 
#all {
	width: 1020px;
	background: url('img/1.jpg') left no-repeat;
	margin: 0px auto;
}
 
#all2 {
	width: 1020px;
	background: url('img/2.jpg') right no-repeat;
}
 
#content {
	width: 1020px;
}
[HTML] pobierz, plaintext 

Można i obrazki przerobić na całą szerokość - po jednej stronie będzie miał po prostu przezroczystość, a po drugiej właściwy obrazek ...