Zaloguj się

Asharon Drakan · 19-06-2010, 03:47

Witem
Robię stronkę i mam mały problem z tłem
Chodzi mi o to, by wykonać tło strony dopasowujące się automatycznie do rozdzielczości ekranu?
Za tło robi zdjęcie i jeśli ustawię zdjęcie o rozdzielczości 800x600 a wyświetlam stronkę np w 1280x1024 to zdjęcie albo się powiela, albo po dopisaniu linijki w kodzie jest statyczne a reszta tła pozostaje biała, natomiast jeśli ustawię tło na 1280x1024 a odpalam stronkę z 800x600 to zdjęcie jest ucięte
Jest jakiś kod który automatycznie dopasuje zdjęcie tła do rozdzielczości?
Z góry dzięki za info Smile

**Dhofca** · 19-06-2010, 05:54

Kod:
img.bg {

min-height: 100%;

min-width: 1024px;

width: 100%;

height: auto;

position: fixed;

top: 0;

left: 0;

}

Masz szczęście, bo akurat coś takiego robiłem. Proszę. Wink

Asharon Drakan · 19-06-2010, 16:00

Kod:
/*STRONA*/

body {

    background-image: url(tlo2.jpg);

    background-attachment: fixed;

    margin: 0;

    padding: 0;

}

img.bg {

min-height: 100%;

min-width: 1024px;

width: 100%;

height: auto;

position: fixed;

top: 0;

left: 0;

}

/*/STRONA*/

Zrobiłem to w ten sposób, niestety dalej jest to samo ;/

KeeL · 19-06-2010, 18:08

(19-06-2010, 16:00)Asharon Drakan napisał(a):
Kod:
/*STRONA*/ body { background-image: url(tlo2.jpg); background-attachment: fixed; margin: 0; padding: 0; } img.bg { min-height: 100%; min-width: 1024px; width: 100%; height: auto; position: fixed; top: 0; left: 0; } /*/STRONA*/

Zrobiłem to w ten sposób, niestety dalej jest to samo ;/

A dodałeś do tego zdjęcia odpowiednią klasę?

Podaj najlepiej kod HTML

Asharon Drakan · Liczba postów: 3 Liczba wątków: 1 Dołączył: 19-06-2010 Reputacja: 0

Kod:
<body>

<div id="top">

    <div id="BODY">

        <div id="LOGO"><!--LOGO--><img src="Baner.jpg" width="733" height="150" border="0" alt="Rozmiar: 11556 bajtów" title="Rozmiar: 11556 bajtów" /><!--/LOGO--></div>

        <div id="LINKI">

        </div>

        <div id="MENU">

            <!--MENU-->

            <div class="MENU">

                <div class="NAGLOWEK" id="MENU_NAGLOWEK"><!--NAGLOWEK MENU--><!--/NAGLOWEK MENU--></div>

                <div class="ZAWARTOSC">

                <!--ZAWARTOSC MENU-->

                    <ul>

                    <li><a href="o mnie.html"><img src="O mnie.png" width="190" height="80" border="0" alt="" title="" onmouseover="if(document.images) this.src='O mnie2.png'" onmouseout="if(document.images) this.src='O mnie.png'" /></a></li>

Tak wygląda to w html, do niego jest podpięty styl w css

KeeL · 19-06-2010, 19:36

(19-06-2010, 19:08)Asharon Drakan napisał(a):
Kod:
<body> <div id="top"> <div id="BODY"> <div id="LOGO"><img src="Baner.jpg" width="733" height="150" border="0" alt="Rozmiar: 11556 bajtów" title="Rozmiar: 11556 bajtów" /></div> <div id="LINKI"> </div> <div id="MENU">  <div class="MENU"> <div class="NAGLOWEK" id="MENU_NAGLOWEK"></div> <div class="ZAWARTOSC">  <ul> <li><a href="o mnie.html"><img src="O mnie.png" width="190" height="80" border="0" alt="" title="" onmouseover="if(document.images) this.src='O mnie2.png'" onmouseout="if(document.images) this.src='O mnie.png'" /></a></li>

Tak wygląda to w html, do niego jest podpięty styl w css

Wydaję mi się że do tej linijki:

Kod:
<img src="Baner.jpg" width="733" height="150" border="0" alt="Rozmiar: 11556 bajtów" title="Rozmiar: 11556 bajtów" />

Powinieneś dopisać gdzieś klasę, albo id, a w kodzie css odpowiednio się do tego odwołać.

A zastanawia mnie co to jest ten Rozmiar: 11556bajtów ?

**Dhofca** · (Ten post był ostatnio modyfikowany: 20-06-2010, 03:07 przez Dhofca.)

Tak, oczywiście jeżeli chcesz zrobić taki trick nie możesz usatwiać tła poprzez css: body {backgound: ... }.
Musisz wstawić zdjęcie normalnie w kodzie strony:
<img src="sciezka" class="bg" alt="" />

Zaloguj się
Login:
Hasło:	Nie pamiętam hasła
	Zapamiętaj mnie