Jaka jest różnica miedzy linkowaniem do stylu, a wklejniem go do sekcji head? Opcje

[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

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?
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?

Ten post edytował pawel.ad 17.04.2011, 12:37:22

[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 -

Ś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

Ten post edytował pawel.ad 17.04.2011, 12:46:37

[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...

Dzięki za pomoc.