+- Forum Webmastera, HTML, CSS, PHP, MySQL, Hosting, Domeny - Forum dla Webmasterów (https://www.webmastertalk.pl)
+-- Dział: Technologie internetowe - tworzenie stron WWW (https://www.webmastertalk.pl/forum-technologie-internetowe-tworzenie-stron-www)
+--- Dział: Początkujący webmaster (https://www.webmastertalk.pl/forum-poczatkujacy-webmaster)
+--- Wątek: Automatyczny rozmiar obrazka (/thread-automatyczny-rozmiar-obrazka)
Automatyczny rozmiar obrazka - lomek - 08-06-2012
Witam mam taki oto problem. Strona ma zajmować całą szerokość i wysokość ekranu niezależnie od rozdzielczości. Więc mam ustawione wartości procentowe odpowiednio:
Kod PHP:
#header{width:100%;
height:10%;}
#content{width:100%;
height:80%;}
#foot{width:100%;
height:10%;}
Wszystko fajnie się układa, ale jako tło contentu wybieram sobie zdjęcie. Jest ono duże ok. 1600px 900px; chce aby było widać je całe nie zależnie od rozmiaru ekranu, bo teraz zdjęcie nie jest skalowane i ucina mi np. istotne elemnty
RE: Automatyczny rozmiar obrazka - camelrafal - 08-06-2012
możesz też dać do body ten background
Kod:
body{
background:url(obrazki/obrazek.jpg) center center no-repeat;
background-size:cover;/*jeżeli chcesz aby rozmiar obrazka zmieniał się sam*/
}Kod:
body{
background:url(obrazki/obrazek.jpg) center center no-repeat;
background-size:100% 100%;/*rozciągnie się i zgubi proporcje*/
}i raczej nie ustawiałbym wysokości nagłówka i stopki w procentach a raczej w stałych pikselach
-wysokość będzie się zmieniała w zależności od rozdzielczości np. raz będzie miała 100px a innym razem 120px czyli się rozjedzie - chyba że tak ma być
RE: Automatyczny rozmiar obrazka - lomek - 09-06-2012
(08-06-2012, 17:03)kornell napisał(a):Hm mimo wszystko obrazek jest ucinany i z góry i z dołu czyli wyświetlany w pełnej krasie 1600x900Kod:#header,
#content,
[b]#foot [/b]{
min-width:1024px; /* zmień jak chcesz. Ja zawsze używam 1024px */
width:100% !important;
}
#header { height:10% !important;}
#footer {height:10% !important;}
#content {
background:url("katalog/obraz.rozszerzenie") /*bez powtarzania*/ no-repeat /* wyśrodkowanie w pionie i poziomie*/ center;
height:80% !important;
}
Cytat:i raczej nie ustawiałbym wysokości nagłówka i stopki w procentach a raczej w stałych pikselach
-wysokość będzie się zmieniała w zależności od rozdzielczości np. raz będzie miała 100px a innym razem 120px czyli się rozjedzie - chyba że tak ma być
Tylko jak dam header na 50px; footer na 50px; a content? Jak dam 100% to już pojawia się pasek przewijania
RE: Automatyczny rozmiar obrazka - camelrafal - 09-06-2012
podejewam że obrazek jest raczej ucinany z lewej i prawej a nie z góry i dołu
obrazek masz szeroki na 1600 a wysoki na 900
więc jeżeli ja mam monitor 1440x900 to nawet jak dam wysokość 900 to i tak boki mi obetnie
musisz sie zastanowić co chcesz zrobić z tym obrazkiem
jeżeli chcesz zeskalować to wystarczy że dodasz
Kod:
background-size:100% 100%;Cytat:Tylko jak dam header na 50px; footer na 50px; a content? Jak dam 100% to już pojawia się pasek przewijaniajak content wypełnisz czymś to automatycznie się rozszerzy nie musisz nadawać mu wysokości