Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Jaka jest różnica miedzy linkowaniem do stylu, a wklejniem go do sekcji head?
Forum PHP.pl > Forum > Po stronie przeglądarki > CSS
pawel.ad
Pytam ponieważ mam dziwną sytuację.
Mianowicie staram się zrobić tło na cała stronę wg. http://css-tricks.com/perfect-full-page-background-image/

Bardzo fajnie to wygląda, i udało mi się to zrobić(tj. wkleić parę linijek kodu ; -), ale działa tylko jeżeli styl dla html jest wpisany w head;

Teraz konkretnie - mam plik css: http://wklej.to/whtLQ i sekcje head: http://wklej.to/kG5kl , ale niesety w takim połączeniu wychodzi mi całkowicie białe tło.
Dopiero keidy dodam na końcu head:
Kod
<style>
    html {
        overflow-y: scroll;
        background: url(images/bg.jpg) no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }
    </style>

(czyli dokładnie to samo co jest w pliku style.css !) pojawia się tło.
Za nic nie rozumiem czemu tak się dzieje.
Nie mam nic przeciwko takiemu rozwiązaniu, ale bardzo chciałbym się dowiedzieć czemu tak się dzieje smile.gif

head po dołączeniu <style>: http://wklej.to/j9EyE
kadlub
ścieżki masz dobre do stylów?
może ci sie gryzą te kaskadowe arkusze styli
bo wczytujesz tam dwa może w każdym próbujesz ustawić ten sam element
pawel.ad
Tak, ścieżki są dobre.
<link rel="stylesheet" href="_/css/style.css"> - reset.css
<link rel="stylesheet" href="css/style.css"> - zwykły styl

Ale nawet jeżeli coś się gryzie, to czemu jak wpisuje w head to wszystko działa? smile.gif
Wklejam jeszcze _/css/style.css - może to tutaj jest wina? http://wklej.to/pavSu

Bo jak to działa - styl który został podlinkowany drugi nadpisuje wartosći w pierwszym, tak? To co robi styl wpisany bezposrednio w head? Jest najbardziej nadrzędny? Próbowałem zrobić 3 plik ze stylami, tylko z html {}, i podlinkowałem go w ostatniej linijce head - nadal nic.

WTF? smile.gif
kadlub
style ustawione bezpośrednio na stronie maja pierwszeństwo
pawel.ad
Tak myślałem, ale za wiele mi to nie wyjaśnia.

Zrobiłem mały test. Usunąłem wszystkie podlinkowane arkusze, i podlinkowałem tylko styl html.css o zawartości:
Kod
html {
    overflow-y: scroll;
    background: url(images/bg.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

Nadal nie działało!

Ale jak wpisałem w head (bez żadnych podlinkowanych arkuszy):
Kod
<style>
html {
    overflow-y: scroll;
    background: url(images/bg.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
</style>

to tło pięknie się wyświetlało.

Ktoś ma jakiś pomysł? Są to bajery z CSS3, i tutaj może być pies pogrzebany, ale i tak nie rozumiem czemu wpisane head działają, a podlinkowane - nie...

EDIT:
Zagadka rozwiazana -
Cytat(Crozin @ 17.04.2011, 13:40:33 ) *
Ścieżki względne w CSS-ie mają to do siebie, że odwołują się z poziomu arkusza CSS, nie dokumentu HTML. Tak więc w Twoim przypadku finalny adres do obrazka to: http://domena/css/images/bg.jpg, który jest niepoprawny. Powinieneś podać ścieżkę ../images/bg.jpg
Crozin
Ścieżki względne w CSS-ie mają to do siebie, że odwołują się z poziomu arkusza CSS, nie dokumentu HTML. Tak więc w Twoim przypadku finalny adres do obrazka to: http://domena/css/images/bg.jpg, który jest niepoprawny. Powinieneś podać ścieżkę ../images/bg.jpg
pawel.ad
No w sumie... smile.gif

Dzięki za pomoc.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.